3D ON THE WEB: The revolution is here - get your site up to speed with our Web 3D tutorials and tips 


THE COMPLETE GUIDE TO 


3D WEB DESIGN 


PROJECTS... 


- Design a Shockwave 3D game 

- Create a 3D navigation system 

* Build your own 3D screen saver 

- 3D-ize products in your online shop 


TECHNIQUES... 

- Create interactive site buttons 
- Modelling objects with plasma 
- How to fix jagged renders 


=e TIPS AND. TRICKS 
sae GET STARTED WITH OUR 
eee \ EXPERT WEB 3D TUITION 


? ? 
Buyer’s guide 
Which package is best for you? Read 
our guide to buying Web 3D software 
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PLASMA 
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Powerhouse Web 3D modelling software from Discreet 
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Mac OS X v10.2 is widely acclaimed as the 
ultimate operating system for the new 
millennium. It blends Apple’s legendary ease 
of use with the rock-solid reliability of UNIX. 
And this latest version of Mac 0S X is every 
bit as innovative as the computers that run it. 


Whether you are a Mac user who is upgrading, a Windows user 
who is thinking of switching to a Mac or even a UNIX user who 
relishes the idea of commanding an advanced, crash-proof and 
secure UNIX-based operating system, this is the one for you. 


Quartz Extreme is another great feature, giving you graphics that 
are incredibly fast. Mac OS X uses the power of your computer's 
built-in graphics engine to make your desktop — and everything you 
see — more responsive. This hardware accelerated, fully composited 
graphics system gives souped up 2D and 3D capabilities, 


Then there is Rendezvous, revolutionary technology using the 
industry standard IP networking protocol that lets you create an 
instant network of computers, printers and other peripheral 
devices over AirPort, Bluetooth, USB or FireWire — without having 
to manually configure drivers or settings. Mac OS X does it all for 
you — automatically. 


Mac OS X v10.2 also debuts QuickTime 6, the next generation 
multi-media standard that supports MPEG-4 video, the new 
worldwide medium for playing and viewing professional quality 
audio and video on the internet. 

Combine these and many other great features with the fact that 
the complete Adobe Design Collection runs superbly on Mac 0S X 
and you have an operating system that leaves others where they 
belong — firmly in the past. 


* 


www.apple.com/uk/macosx 


nd other countries, Quartz and Rendezvous are trademarks of Apple Computer, Inc. Other product and company names mentioned herein may be trademarks of their respective companies. 


78 Xara3D 5 


Create a 3D scre aver by following our tutorial 
and using the Xara3D 5 demo onthe cover CD 


82 Commotion 


his special effects software to combine film and 
ind learn how to perfect damaged footage 


PROFILES 


Y Swift 3D 


Build a 3D fighter plane in plasma and The best tools for learning the art of Web 3D 
export it to Flash or Shockwave and bringing your Website to life 


yas} Joost Korngold 
Dutch freelance graphic designer, Web artist and 


A 0, AXEL basics +O AXEL advanced animator shares some of his 3D wares 


Add interactions to your AXEL creation 
with this advanced tutorial 


Freakish Kid builds a multimedia player 
with this complete authoring tool 
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Create a game ke objects spin 


How to build a Shockwave 3D videogame Create a spinning object that'll run in Kansas City’s MK12 lets us into its motion graphics, 
using plasma and Director QuickTime on the Internet animation and design studio 


NAVIGATION COVER CD 


Find your way around — let Demos, movies and 
the colour guide you resource files on the CD 


04 | 3D onthe Web 


ng FEATURES ne REGULARS 


ee 
08 Tools of the Web 3D trade 


We introduce you to four of the best applications available for 
designers looking to break into Web 3D 


Web 3D can be a daunting prospect. We 
untangle this complex world and leave you in 
no doubt that it’s the way forward 


FA Online stores 


Our guide to viewing and creating 
interactive 3D objects on the Web 


THE COVER ILLUSTRATION 


Martin Fewell 


www.martin fewell.com 


=] 30 Web 3D tips 


Having problems getting started with Web 3D? 
Our 30 hints and tips will give you a solid basis 
on which to build 


52 Digital Arts World 


Everything you could ever want to know about the 
festival you cant afford to miss, including a full diary 
of events on pages 56 and 57 


92 Free 3D models 


On this month's cover CD you'll find 20 free 3D models 
from Geo-metricks. Use them on your Website or in 
other 3D environments 


96 Buyer’s guide 
Around-up of six of the best books covering 3D 


graphics, animations and interfaces. We review and 
rate each one for you 


computer 


07 CD contents 


Full version of Xara3D 2.1 plus demos of 
plasma, Swift3D, AXELedge and much more 


26 Plasma compo 


Win one of two copies of Discreet’s new Web 
3D design tool, worth £525 


36 Swift compo 


Three copies of Swift 3D v3 are up for grabs, 
courtesy of Electric Rain 


51 Subscribe to CAS 


Want every issue delivered to your door? Then 
don't miss out on this subscription offer 


81 Xara upgrade 


Like our demo of Xara3D 5?Then upgrade to 
the full product at a special discount price 


90 Back issues 


Missed a copy of Computer Arts Special? 
Hurry and you might still be able to buy one 


94 Subscribe! 


Subscribing to Computer Arts Special and 
Computer Arts can save you money 


98 Next issue 


Our Drawing Techniques issue will be out on 
24 October. For full details turn to page 98... 


Available in British and 
American flavours 


Cre@teOnline and Web 3D 


After disappointment the last time around, 

is Web 3D seeing a resurgence among 
professional Web designers? Oursister 
magazine Cre@teOnline has a 10-page section 
on the best 3D sites and opinions from the 
people behind them. There's also a round-up of 
the key software available. It’s £6 in newsagents 
now, or visit www.createonline.co.uk 
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macpeople 


design: sept oct 
llustrator Fdn SH 14 
lustrator Adv 25 - 
Freehand Fdn 16 - 

Quark XPress Fdn - i) 
Quark XPress Adv 244 - 
Photoshop Fdn 26827 Pe (Sig 
Photoshop Adv 586 30 G1 
Director Fdn 26627 - 

web: 

Web Design with DreamWeaver - 7&8 
Flash Mx - 121 es 
Advanced Flash 26 & 27 - 
filemaker 

FileMaker Fdn 25 - 

Intro to FileMaker Development - 21 822 
system 

OSX System Admin 12613 Se710 
OSX User - 22 

OS9 System Admin - 2486 25 
upgrades 

Quark 5 - = 
Illustrator 10 18 28 
Photoshop 7 = 29 


the above courses are exclusive of VAT and scheduled to run on the date indicated. 
macpeople reserve the right to a: cancel a course and offer a full refund b: offer an date, 
or c: offer the same rate for a custom course. in the case of 2 dey courses, 1 day 1 to 1 training will be offered. 


—— 


t.0161 661 See5 
f. 0161 661 5225 


scheduled training courses 


duration 
1 day 
1 day 
1 day 
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1 day 
2 days 
2 days 
2 days 


2 days 
2 days 
2 days 


1 day 
2 days 


2 days 
1 day 
2 days 


1 day 
1 day 
1 day 


e. sales@macpeople-training.co.uKk Ww. macpeople-training.co.uk 


41st Floor - swan buildings - swan st - manchester - m4 Siw 
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Xara3D 5 (Pc) 


If you like Xara3D 2.1, you'll love our 
demo of its most recent update 


Use this demo of Discreet's Web 3D powerhouse to 
follow our plane-modelling tutorial on page 20 
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for use in real e applications, On this 


month’s CD we've included 20 free models for Swift 3 D v2 (dual) 


9 use in your 3D environments, includins : 
you to use in your 3D environments, including Vector-based modelling with this dual demo, plus 


fantasy characters, vehicles, buildings and Swift 3D LW (dual) and Swift 3D MAX(PC only) 
plants. Turn to page 92 to find out what's on Atm osphere (PC beta) 


the CD and [w] www.geo-metricks. e The beta version of Adobe's Atmosphere 
gives you a taster of building 3D worlds 


to see their full collections.. 


Powerhouse Web 3D modelling software from Discreet 


Shrines: — 


AXELedge (dual) 


Create interactive 3D Web content and follow our PUIG ALL IPE FILES REQUIRED TO COMPLETE OURCEXPERT TUTORIALS 
two AXEL tutorials with this excellent demo , 


For full listings and contacts, see your CD inlay card. 
For free downloads go to [w] www.computerarts.co.uk. 
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Tools of the Web 3D 


We review four of the best Web 3D applications out there... 
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Illustration: Martin Fewell [w] www.martinfewell.com 


year or three ago, getting 3D content up on the Web 
f was a rather traumatic affair. Only a few technologies 
; existed, often involving complex 3D modelling and 
| JavaScript programming. The end user would also 
need a super-fast machine to view content. However, Web 3D 
times have well and truly changed. Web 3D is the Flash of 2002, 
and more and more Web designers want a piece of the action. 
Now we have more Web 3D tools than ever before, and 
what was once a medium for e-commerce and product 
showcases has evolved into a serious medium for the designer. 
Essentially, Macromedia started the Web 3D craze and 
really got the ball rolling with Director 8.5, introducing 
Shockwave 3D. This has become an incredibly popular file 
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format, with the majority of, if not all, the major 3D 
applications exporting models to the format. Other tools such 
as AXEL, Swift 3D and more recently Discreet's plasma have 
grown in stature and user bases, thanks to the designer's quest 
for a more rounded Internet. 

We've looked at four of the best Web 3D tools available 
today — plasma, Swift 3D, AXELedge 1.5 and Director 8.5. 
Each one of these tools has a different take on creating 3D 
Web content, and each is extremely powerful in its own right. 
It may be that more than one of the following tools is suitable 
for you — each can be integrated with the others in some way. 
So read on and see how Web 3D tools can change the way you 
design your interactive content... 


trade 


Discreet 


Telephone 


0207 851 8000 


www.discreet.com 


Best features 


¢ Excellent dynamics and IK tools, 
great renderer 


Rendering with multiple shadows allows for 
more creative control within Flash. 


he industry has got rather 
excited about plasma — and 
j ; with good reason. plasma has 
| acomplete 3D modelling and 
animation toolset, along with character 
animation tools and the ability to render 
out scenes in both Flash and 
Shockwave 3D (w3d) formats. 

Like 3ds max, modelling in plasma is 
a matter of creating primitives, making 
them editable and using various 
modifiers to create more complex 
objects. Primitives include the usual 
sphere, cylinder and so on, as well as 
extended primitives including oil tank 
and capsule. Objects can also be 
created by, amongst other methods, 
sweeping, extruding or rotating curves. 
A full-on particle system is also 
present, enabling you to create spray or 
snow particle explosions and attach 
them to a path and so on. Lighting 
controls are here too, with the option to 
create directional, target or omni- 
directional lights. 

The pros of plasma become even 
more obvious when you realise that 
there is a complete dynamics toolset 
on offer here. This enables you to add 
physical properties such as mass, 
elasticity or friction to 3D objects. The 
fact that the Havok dynamics engine is 
compatible with Director 8.5 makes it 
even more exciting. 

The usual IK/FK tools are also 
present, making it possible to build 
complex characters with realistic 
movement. These tools are pretty 
easy to use, and if your knowledge 
extends to 3D applications, you'll be 
up and running in no time. However, if 
you're simply a Web artist looking 
for some 3D Flash or Shockwave 
content, this is where plasma will be 
at its most daunting. 

And the renderers supplied with 
plasma are just about the best there 
are. The Flash renderer, pioneered by 
Ideaworks3D, is one of the best we've 
ever seen and it handles the 
transformation of 3D object to vector 
animation exceptionally well. Settings 
give you control over gradients, line 
weights, shadows and more. The 
Shockwave 3D exporter is similarly 
impressive, and offers control over 
exactly which elements you export — 
from texture map data to lights and 
animation. You can also specify 


plasma features full support for skinned deformable characters, so no compromise need be made 
with Web-based character animation. 


compression on your model’s geometry 
directly from plasma. 

Our only real problem with plasma is 
in its lack to add any sort of 
interactivity to Flash or Shockwave 


“Enables you to add physical 
properties such as mass, elasticity 
or friction to 3D objects” 


animations. We're sure that Discreet 
would argue that this can be handled in 
Flash or Director, but we would have 
liked to have seen at least a basic 
interactive toolset. We're not asking for 
full-on ActionScript implementation or 
anything, just a few basic commands. 
This would improve workflow when 
switching between plasma and 
Macromedia's applications. 

Overall though, you can't grumble. 
plasma delivers a complete 3D 
modelling, animation and Web 3D 
rendering solution for a pretty good 
price. Those used to 3D apps wanting to 
port their work to the Web will love this, 
but Web designers may cringe at the 
thought of modelling in 3D. That said, if 
you can bring yourself to learn a new 
way of working, plasma will deliver. > 
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AXELedge 1.5 


Interactive Web 3D authoring with no coding involved... 


Price 
£846 


Company 
MindAvenue 
Telephone 
(CU) 0208 200 8282 
Website 


www.mindavenue.com 


Best features 


¢ Interaction Editor — intuitive and 
extremely powerful 


hen AXEL was first 
launched it received 
praise from almost 

j everyone in the industry. 
This was mainly due to it being the first 
3D authoring tool that was really 
geared at Web output. What's more, it 
worked. The interface was clean and 
customisable and the tools powerful 
yet intuitive. It was immediately 
obvious that Canadian-based 
MindAvenue was onto a winner. 

Recent updates have seen the 
package go from strength to strength, 
with AXEL content no longer relying on 
a specific player, but being able to be 
viewed in the incredibly popular 
QuickTime plug-in. A new update also 
enables you to import Flash content — 
with actions intact — add AXEL 3D 
content and then export the whole lot 
as an SWF. Updates planned forthe 
future include Shockwave 3D 
implementation — and with this, AXEL 
looks set to become one of the most, if 
not the most, powerful all-round Web 
3D applications available. 

AXEL, like plasma, has a complete 
set of modelling tools. Using curves 
and surfaces as well as extrusion and 
revolution tools, you can build complex 
models. Texturing is also well catered 
for, with AXEL not only enabling you to 


“It's a piece of cake to link mouse 
triggers to specific actions, such as 
playing a certain movie” 
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map bitmap textures onto objects, but 
also QuickTime movies. The latter is 
particularly interesting, enabling you to 
set up three dimensional video cubes 
and walls, with a different video texture 
on different faces — the possibilities 
are almost endless. 


Intuitive interactions 


But where AXEL really stands out is in 
the Interaction Editor. This intuitive 
dialog enables you to connect 
reactions to sensors simply by 
attaching connector nodes. This is a 
dream to use — it’s a piece of cake to 


[ee EA Yow Yedd Gone Vase mee Twet BRN eb 
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rr 
‘@ Postion = -0.00 -0,00 0.51 
@ Orientation = 0.0.0.0 0.0 
@ Scale = 0.09 0.07 0.09 
@ Vuble = Yes 
@ Antialasing = No 
* gay PlaneGeometry! (screen) 
a] 
@ Rendering style = Shaded 
@ Advanced color mode! = No 
@ Color = 252 252 252 
@ Shines 
e< 0 
@ Transparency = 0,00 
@ Texture erabled = Yes 
Be Texture settings 
(3 Morertel (Work tune) 
@ Fle = Work_1.mov 
@ Duration = 3.20 


AXEL features a complete 3D modelling and animation toolset, with bones IK, FK, and a fully- 
fledged particle system. Anyone from a 3D background will quickly get to grips with these tools. 


link mouse triggers to specific actions, 
such as playing a certain movie, 
changing the colour of a model or 
setting off an animation. It makes so 
much sense linking triggers to actions 
in this way, you kind of wonder why 
someone hadn't thought of it before. 

Character animation is a breeze in 
AXEL, although again, if your roots are 
as a Web designer, this part of the 
application will be the trickiest to get to 
grips with. Another excellent feature of 
AXEL is Relations. These enable you to 
constrain objects via springs, ball 
joints, bounding boxes and so on, and 
they’re pretty easy to set up. 

AXELedge 1.5is a superb tool. It’s 
easy to pick up, extremely powerful, 
and provides you with a set of intuitive 
Web 3D features that cannot be 
ignored. Look out for much more AXEL- 
based content on the Web soon. 


SRvVDPRRHB 


The Interaction Editor is top-notch, enabling 
the user to link events to mouse triggers 
without using any code. 


Swift 3D v2 


Create 3D Flash content in no time at all with Electric Rain's latest offering... 


Price 
$159 (£102) 


Company 


Electric Rain 


Telephone 
001 888 613 1500 


Website 
www-.erain.com 


Best features 


Great Flash renderer, good 
modelling tools 


wift 3D is a dedicated Flash 
3D tool. By this we mean 
that it is a tool geared 

| towards creating 3D models 
and animations destined for Flash 
output. Unlike plasma, there is no 
support for Shockwave 3D, and no 
dynamics/character animation tools. 
But then again, it’s much cheaper at 
just $159. 

The Swift 3D workflow consists of 
either modelling objects from scratch 
and then animating them (more about 
this in a bit) or importing a .3ds scene, 
modifying it and rendering it out. You 
can also import Illustrator EPS files for 
use as spline curves. The modelling 
tools within Swift 3D v2 are pretty 
healthy, and include a Lathe Editor (for 
rotating splines) and an Extrusion 
Editor, which is best used when working 
with text. New to version 2 on the 
modelling side of things are PostScript 
font support, improved camera and 
light targeting and non-uniform 
positioning of objects. 


Swift interface 


The interface itself is divided into four 
tabs. Situated along the top of the 
screen, they are as follows: Scene 
Editor, Extrusion Editor, Lathe Editor 
and Preview and Export Editor. The 


The Scene Editor is where you create and position all models, cameras and lights. You can also 
assign materials to objects here, as well as animate them. 


Swift 3D’s Lathe Editor provides an easy and 
thoroughly intuitive way of building 3D 
models from Bézier curves. 


first tab is where you position your 
elements in 3D space, adding lights 
and cameras accordingly. It is also 
where you set up various animations. 
Swift comes with a variety of preset 
animations, or you can create your own 
using keyframes on the timeline. 

The Extrusion Editor, as we've 
mentioned, is great for text and logo 
design — enabling you to create 3D 
logos from 2D fonts and eps files. The 


“The renderer is about as fast as 
they get - and comparable to 
plasma in quality” 


Lathe Editor is a pretty standard 
revolution affair, offering the ability to 
draw splines using Bézier tools and 
create 3D objects from these. Swift 
automatically updates your scene when 
you return to the Scene Editor. The 
Preview and Export Editor is where you 
render out your scene to Flash swf 
format. The ability to change stroke 
weight, fill type and shadow and 
specular rendering is here, and the 
renderer is about as fast as they get — 
and comparable to plasma in quality. 

Swift 3D also comes as plug-ins for 
LightWave, 3ds max and Softimage, so 
if you're already using 3D tools, you can 
take advantage of the great renderer on 
offer here. Swift is an undeniably good 
tool, but like plasma offers no 
interactivity tools — only modelling and 
animation. For the money though, it’s a 
sound Flash 3D solution. > 
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Director 8.5 


The industry standard multimedia app has a mass of tools for Web 3D artists... 


i has long been 
£1115 irector 
associated with CD-ROM 
and multimedia production. 
: But since version 7, while 
Macromedia retaining its roots in multimedia 
; authoring, it has become a Web tool to 
ee one f 
Tele phe sat be reckoned with. An example of top 


(CU) 0208 200 8282 
www.macromedia.com/uk 


Best features 


¢ Excellent preset 3D behaviours 


site 


quality Shockwave content (Shockwave 
is the format that Director exports to) 
can be found at the thoroughly 
entertaining Shockwave.com. At 
version 8.5 though, Macromedia 
unleashed a plethora of Web 3D- 
orientated tools — and came up witha 
new format, Shockwave 3D. 

3D software companies have been 
extremely quick to adopt this format 
and now most, if not all, of the big 3D 
apps (Maya, Softimage, LightWave, 
Cinema 4D and so on) export models to 
the Shockwave 3D format. 

The great thing about Director is that 
ittreats 3D models like it does any 
other cast member. Specific actions and 


“Create complex games and 


presentations that have realistic 
physics and collision detection” 


behaviours can be applied to 3D 
models, simply by dragging-and- 
dropping from a library onto your scene. 
The power of Director becomes even 
clearer when you realise that it features 
acomplete dynamics system — from 


Web 3D resources 


Need W3D models? Or perhaps you’re stuck with AXEL Relations? If so, these sites are for you 
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] http://www.turbosquid.com/ 


Turbo Squid has a variety of w3d models available for download. Some are free and some you have to pay 


for, but all are good quality. This resource could save you a whole load of modelling time. 


http://www.geo-metricks.com/ geo-shop/shop-htm/free-object-info.htm 


Many more w3d models on offer here for use in your Director 8.5 projects. You'll have to have a good hunt 
around to find the model you need, but it may be worth it 


http://www.mindavenue.com 


| Loads of quality AXEL tutorials on offer here, straight from the horse's mouth so to speak. From creating an 
interactive dimmer switch to building a full-blown character and animating it, there's lots of high-quality, 
and more importantly free, advice at MindAvenue's own site. 


Click to enter CD 


AME” & RETURN 6 RETURN 6 


Jend getBehavicrDescription 
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Director may not be the easiest package to get to grips with, but once its native scripting language, 
Lingo, is mastered, high-quality Web 3D content can be created ina relatively short space of time. 


Havok. This enables you to create 
complex games and presentations that 
have realistic physics and collision 
detection. This makes Director great for 
driving games and the like. Bear in mind 
though, this sort of game is not that easy 
to create; you'll have to learn another 
scripting language for starters, namely 
Lingo. Having said that, Flash designers 
should pick up Lingo fairly quickly — the 
syntax is not that different from 
ActionScript. Director also offers the 
ability to set up IK and FK chains 
directly from within the application, 
meaning that you can create complex 
character animations and export them 


http://www.shockwave.com 


forthe Web within one single app. A 
particle system is also here, and you 
can set it up so that certain events 
trigger particles to be spewed from 3D 
space or from an object. The potential of 
Director is truly awesome. 

While Director is a great tool for 
Web 3D, it is not solely dedicated to the 
cause, and for this reason those looking 
fora Web 3D solution may be better off 
with the likes of AXEL. However, if 
you're after an all-encompassing 
multimedia tool with the ability to 
create entertaining 2D and 3D content, 
there's no better tool on the market. It 
is, however, expensive at £1115. EI 


The place to go to see exactly how Shockwave 3D can bring the Web to life. Many top-quality 3D games 
can be found here, and all are pretty revolutionary as faras 3D on the Web is concerned. Just don't blame us 


if you get hooked. 


http://www.swift3d.com/extreme/ 


One of the best examples of Flash-based 3D on the Web. And it’s all been built in Swift 3D by Electric Rains 
in-house designers. A great showcase for Swift 3D v2. 


http://www.thebig3d.com 


Enter the biggest Web 3D competition online and you could win a share in the $15,000 worth of prizes up 


for grabs. The deadline is November 1st and the prize includes coverage in 3D World magazine 


domain names webhosting 


easy on your pocket easy service 
from £3.50 2 Se wor- from £30.00 


canal en OE 


ecommerce 
easy action 


WWW.easyspace.net 
The UK’s largest domain name registrar offers service, expertise eas Ss ace 
and value for money - all backed with reliable, robust technology. 


Put our size and strength to work for you domain names - ecommerce - webhosting 


SHOW ME THE MONEY 


ee THE BIG ISSUE: EXPERTS TALK MONEY 
As the industry picks up the pieces and gets itself back into shape, we look 
at how new media designers will get the cash flowing in for 2003, and 
industry experts give their advice on staying in business for the coming year 


RES _ THIS ISSUE: 


IS WEB 3D BACK TO STAY? 

Alongside the arrival of new software such as plasma and Atmosphere, the 
use of 3D in websites is undergoing a resurgence. We look at how Web 3D 
could fit into your design schemes moving forward, and cast an eye over the 
key software available to Web designers today 


USABILITY TEST: TOY SITES 
It's Hamleys versus etoys.com. Which online toy shop has the right stuff? 
Our experts test the usability of four leading toy sites and give their verdicts 


DAVID MARTIN OF FANTASY INTERFACES 

The young Irish designer and founder of Fantasy Interfaces seems to have 
struck online gold with sites like Conspiracygames.com. We talk to him 
about his road to success and where he sees the Web heading 


PLUS: news on MMS and the browser war, Windows Media 9, Iconobloc, 
Adidas a3 and how to win work from telcos 


FRIDAY 27.09.02 


OSX | OSSAND9 | SOFTWARE | HARDWARE | INTERNE 


THE ESSENTIAL GUIDE TO GETTING MORE FROM YOUR MAC 


CAL PAGES! 


of Optimise your, 0S 
of Upsrade with confidence 
of Double your work rate 


I * il M ; U : 
Y R Ni A ] oY ‘Troubleshoot problems 
es WV Sirf the Web faster 


Spot and fix problems with your Mac to get it running perfectly 


PLUS: | 


DIGITAL a 
PHOTOGRAPHY 


Complete guide to editing & outputting 
your snaps 


GET ADSL NOW! 


Broadband: our tutorial makes set-up easy 
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Untanglingthe | 
complex world 
of Web 3D 


With the increasing availability of bandwidth 
and computer technology for the average Joe, 
is interactive 3D now feasible or are we still 
talking a load of rotating balls? 


é any, many moons ago, back | purposes, no. The code, file sizes of 
7 in the dark days of the | published material and quality of the 
' Internet, some individuals | end 3D model may be different, but the 


| operation within the 3D environment is 

| pretty much the same. As with 

| QuickTimeVR, which is a simple ‘pan 

| around’ within a pre-rendered 3D 

| environment or object, you can do pretty 
| much two different operations: walk 

| around ina fully immersive environment; 


decided to code an 
interactive 3D world that could be 
accessed within the browser. This was 
called VRML, and, erm, initially it didn’t 
do all that well to say the least. 

These days there are many different 
types of technology that produce the 
same kind of thing, but are they actually 
any different? To all intents and 


| and bobs of a showcased product. And 


or rotate, click, move or flip open bits 
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Web 3D showcase 


Cube Solutions — Time Distortion Unit 
Website www.cube-solutions.net/tdu 

Designed by Cube Solutions 

Technology used Shockwave 


Demonstrating an online Computer Managed Learning System, Cube has incorporated a 
fictional interactive product to profile its backbone product. This is an example of how 


interactive 3D training can be achieved over the Internet using existing technologies. 


Horses for Courses 

Website www.thequality.com/horsesforcourses/en/index.html 
Designed by The Quality 

Technology used Brilliant Digital 


Horses for Courses was showcased at SIGGRAPH 2001, where it won the Web 3D 
RoundUp art prize. A cross between game and 3D movie, Horses for Courses illustrates 
the use of multi-lingual content within a 3D environment and tells the story of Pan, the 


funky God of Nature who comes face-to-face with the modern world. 


SH QUEULS HABA 


2advanced 


Website www.2advanced.com/perspectives/ 


Designed by 2advanced 
Technology used Swift3D 


This is a cutting-edge showcase of sites designed by Flash masters 2advanced. It 
incorporates interactive and non-interactive 3D elements, pre-rendered animations and 
vector media to enhance the user’s viewing experience and add to the fast-paced nature 


of the site’s subject matter. 


3D on the Web 


that’s about it for Web 3D content. There 
isn't much else, but then again there 
doesn't really need to be. 


Showcasing 3D products 

The Web is one big marketplace, and 
technology is beginning to be geared to 
this specific service. When you visit a 
shop, you hold an item, turn it around in 
your hands, perhaps press a few buttons, 
accidentally break it, and run out of the 
shop to the sound of ringing alarms. 
Seriously though, now the same thing 
can be achieved with interactive Web 
content: rotating the object is a simple 
operation that most if not all 
technologies can perform; interactivity 
such as clicking ‘buttons’ to trigger 
certain events can be product specific; 
some technologies even enable you to 
fire off, say, an audio file when the Play 
button is clicked, others simply flash up 
text that says ‘Play’. This type of online 
content enables the user to view the 
object in real time and see it from every 
angle. Features can be accessed that go 
beyond a simple ‘dummy’ object like 
you'd find in most shops, with online 
demonstrations to illustrate how the 
product actually works. 

One of the earliest products to be 
showcased on the Web in this way was 
the Ericsson R380 mobile phone. 
Seeing its feature set, novel design and 
flip-open keypad that revealed a large 
screen on which you could enter and 
access data was enough to sell the 
product to people who had never 
actually handled the real thing. This 
Website was well put together, with the 
3D element incorporated effectively 
alongside the existing content — 
specifications, colour schemes (which 
could be amended directly on the model 
to help you make your choice) and 


feature sets — using the medium to its 
full potential. 

Back in the early days of the Internet, 
Web designers were few and far 
between. Today, they are in abundant 
supply. As with any new medium, it 
doesn't take long for people to start 
jumping on the bandwagon until 
everyone is competing and the bedroom 
designers are producing the same 
results as the large companies fora 
fraction of the price. And that’s what it 
comes down to at the end of the day — 
money. Research needs to be 
undertaken to ensure that the right tools 
are being used, otherwise your efforts 
and money could be wasted. Interactive 
3D costs more money to produce due to 
the time it takes to develop a modelas 
opposed to just taking a photograph. And 
there's little point producing just one 
interactive model within a site profiling 
hundreds of products because the user 
is unlikely to find it unless it is directly 
linked from the main page. Various 
software companies claim that their 
3D development applications are being 
used by high-brow clients, and yet 
actually locating examples of their work 
is, in most cases, a futile exercise. 


Making Web 3D a reality 

A lot of developers think that Web 3D is 
more of a gimmick than a practical 
reality, but much can be said for Flash’s 
development over the years. Like Web 
3D itself, Flash started out small, with 
only a few sites demonstrating what 
could be done when the toolkit was 
pushed to the limit, while others were 
content to use it within simple HTML 
pages to do things that normal HTML 
couldn't. Nowadays, Flash is 
everywhere, from simple pre-loading 
screens to full ‘movies’ and complete 


Contact: infog@®blaxccun.com 


+49(89)98290241 


Blaxxun 3D content is displayed in a browser after installing an additional plug-in, which allows fully 
immersive 3D content to be delivered to your desktop. 


Panasonic DVD Players 


Website www.panasonic.com/consumer_electronics/dvd_players/default.asp 


Technology used Kaon 


Benefiting from online 3D content, the DVD section profiles two examples of interactive media Cycore’s Cult3D technology enables you to 


in the form of the LAQ5 and XP30 systems. Within the interactive media you can rotate, pan and export, refine and create interactions with 
your pre-built 3D models using a schematic 


perform any basic operation. Additionally you can even size up the item's dimensions using the event-driven interface. 


built-in Measure tool. 


sites. The same can be said for Web 3D 
— it’s only a matter of time before those 
at the forefront will reap their rewards. 
So with the huge amount of software 
out there, where do you start? Over the 
past few years, 3D technology has 
escalated as computers become more 
powerful, code gets refined and faster, 
and artists become more skilled. The 
learning curve of these types of 
technologies is similar. Producing the 
3D content and thinking of ways to get 


Mini around any limitations such as polygon 
count, texture detail and bandwidth can 

Website www.mini.com be challenging. If you have prior 3D 

Technology used Viewpoint Experience Technology knowledge, you should be able to 


understand the terminology used in 


exporters for your specific 3D product to 
browser. With its own intuitive custom-designed user interface in the right-hand pane, users bring the 3D model into the authoring 


Accessed from the main international site, a 3D Mini is available to test drive from within the 


can change the colour and style of their car to suit their own personal requirements. package to set up events, etc. The only 
problem is that most 3D packages are 
not fully supported; there are normally a 
set few that have plug-ins developed for 


shockwave.com 


z 


| 


Download 
Shockwave.com Jigsaws, 


Cybertown Volume III! 


Website www.cybertown.com 


Technology used Blaxxun 


Cybertown is a fully immersive 3D environment that enables the userto communicate with 
other users via a chatroom-style format. Avatars of the characters can be created and 
manipulated within the environment to visit specific areas, sell and trade items, visit clubs and 


concerts or just play with your house pet. One of the originals, and still the best. 


them to export these models, so 
learning a whole new product may be 
required. Additionally, if you feel some 
interactivity within the scene is required 
then you’re either going to have to learn 
the interface of the development 
software, which is not all that difficult, or 
learn to code, which is. With the amount 
of publishing software growing year 
upon year, life should get easier as tools 
are refined and become simpler to use. 
This past year has seen the development 
of several 3D-orientated software 
products specifically designed forthe 
Web. Some have authoring directly built 
in but others don't. The Latter are 
designed to be incorporated with 
existing products that the multimedia 
developer already uses. 


Technological advances 

But which one should you choose? As 
with any new technology, someone is 
going to be the winner, and the rest will 
fall or be merged. With new software 
emerging all the time, it’s still too early 
in the development cycle to determine 
which is the de facto standard. Some 
companies are beginning to show great 
progress while others are folding, even 
though some individuals are still using 
their products. There are technologies 
that not only allow you to rotate, pan, 
move, zoom and perform general 
translations on the object, but play 
interactive ‘movies’ to demonstrate 
specific features of the product ina 
particular scenario. For example, they 
can demonstrate something you could 
not do in real life (such as a cut-away 
animated object to illustrate the 
components moving) or something that 
would be taxing or time consuming to > 


Download Shockwave.com 


Jigsaws Volume tl now! 


play 


COLLAPSE 


Top 5 Create & Send Top 5 Downloads Top 5 Atomfilms 


1. Freeper Clarke 

2. Goanna Humegh 

3. Why The Bat ives in 
Savas 


4. In God We Trust 
5. Anna is Being Stalked 


One of the most popular interactive 3D products available, Shockwave is now becoming even more 
common due to collaborations with 3D manufacturers. 
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2003 Expedition 
3OVIEWS 


Ford Expedition 


Website www.fordvehicles.com/suvs/expedition03/ 


Designed by Viewpoint's creative services team 


Technology used Viewpoint Experience Technology 


The quality of this demonstration is unsurpassed — the animation is smooth while the textures 
and polygon detail are exceptional. Using cutaway detail and transparent objects to showcase 


hidden features, this example shows how an online interactive element should be displayed. 


Dark City 


Website www.hamonrye.com/atmosphere/ 


Designed by George Lippert/Ham on Rye 
Technology used Adobe Atmosphere 


produce in simple 2D. As with most 3D 
software, it’s alla matter of taste and 
level of skill; some packages are aimed 
at the more advanced user, while others 
are geared at the intermediate user or 
beginner — beginner's software can be 
cheaper to purchase at the outset. 
Hardware and software compatibility is 
not really an issue these days, because 
most computers are bundled with 
3D-enabled hardware and operating 
systems to support the vast range of 
3D-orientated games out there. This 
technology is accessed by the Web 

3D software, so in most cases an 
additional hardware or system purchase 
is not required. 

Choosing the right tool for the right 
job is essential — while one type of 
technology may produce excellent 
results aesthetically, its interactivity may 
be next to nothing, and vice versa. Yet 
some can provide successful results in 
both areas if you know how to use the 
software to its fulladvantage. The 
average Web developer will probably 
never need to delve too deeply into 3D 
construction, but they'll still need to get 
their heads around the new medium — 
namely the differences in production 
methods so that they can incorporate 
these new technologies and learn how to 
work within the three-dimensional 
workspace. For a new 3D medium, form, 
composition and general interface 
design needs to be re-considered. Is the 
3D model going to be a re-worked 
component of the existing design, or 


Adobe's Atmosphere, while still in its beta 
stage, displays fully immersive 3D content with 
navigation controls not dissimilar to those of 
any normal 3D game engine. 


something completely new? A lot of 2D 
developers might shudder at the thought 
of working with the Z axis and shy away 
from it, but according to most 
individuals and companies within the 
field it is the way of the future, so you’d 
better start learning! 


Broadband availability 
Bandwidth is an important issue to 
consider, as any Website designer will 
tell you. With Broadband Internet now 
available to the majority of the country, 
it is tempting to go over the top with 
media production, using high-resolution 
textures, models and fancy 
environments. But what about the other 
areas where bandwidth is not available 


Dark City is a fully immersive 3D environment designed to showcase Adobe's new Atmosphere 
interactive 3D product. It encompasses six inter-related worlds, including Dark City, its subway 
system, an underground military complex, a submarine ride, a space station, and the September 
Eleventh Memorial Park. Dark City went on to win the Adobe Atmosphere Design Contest 2001. 


Breakthrough technology finally makes interactive photorealistic Fertured adel Click on the ‘hotspot’ to 
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3D images available on virtually any platform with no plug-in. 
Kaon 3D models can be used for product display on the Web, 
in PowerPoint presentations, online advertising, 2D print and 
web applications, Kiosks or CDs, and multiparty collaboration, 


Kaon Solutions 


Kaon News 
+ PowerPoint Gets 3D » Lear More 
+ DoubleClick Rich Media Certification * Leam More 
+ Kaon and Eloquent Partner * Leam More 
+ Kaon Wins Advanced Imaging Award » Lear More 


Keep me updated on Kaon 


[Eman | Gal] 


an open and close the DVD 
tray 


200M ROTATE if MEASURE — 
> 
- | ey ¥ prepay 


see more examples 


Kaon's team can produce interactive 3D using digital photos to add realism to the 3D object. The 
resulting model is loaded directly into the browser via a Java applet. 


Shockwave Wayforward Technologies - 3D Cueball Alley 


Website www.wayforward.com 
Designed by Wayforward Technologies 
Technology used Shockwave 3D 


One excellent example of Shockwave 3D content on the Web is a 3D pool game, Cueball Alley, 
from Wayforward Technologies. This fun and easy-to-play game incorporates fully immersive 


and interactive 3D with collision dynamics and audio. 


PlentyCrunchySnowFun 


Website www.plentybubblecrazy.com/xmas 
Designed by One Bad Monkey 
Technology used Shockwave 3D 


One Bad Monkey’s unique PlentyCrunchySnowFun Christmas Card utilises Shockwave to allow 
the user to design, send and preview their card. The resulting card takes on the form of a mini 


game in which the user controls a character to access presents which reveal greetings in the 


form of audio, chosen at the card's design stage. 


Links... 


www.web3d.org 


Join the campaign for open standards in Web 3D, or find information about 3D specifications 


www.creative-3d.net 


News and views on the 3D industry in general with a separate section aimed at Web 3D 


www.3DLinks.com 


The place to go to meet other 3D orientated designers. Chat in the forum, or download resources 


www.3dgroove.com 


One of the best developers of online 3D games. Play the games and see what's possible 


www.macweb3d.org 


Resources, news and a gallery of Web 3D sites — and all specifically for Mac users 


The Viewpoint Experience Technology system provides unrivalled image quality and smooth 


animation from within the same browser window, and there's even a team to produce the content. 


yet? Broadband is limited to specific 
areas around a telephone exchange, and 
ISDN doesn't offer that much more 
bandwidth than a 56k modem to 
companies who have more than ten 
people accessing the Internet ona 
regular basis. Models and resources that 
the 3D scene or object call upon will 
have to be optimised with these 
restrictions in mind, and the export or 
publishing feature embedded within 

the software should be able to do this. 
Tests should be performed with various 
types of platform to ensure that the 
model can be easily downloaded and 
viewed within a browser no matter what 
the connection speed is, otherwise 
you'll simply be wasting your time and 
money on development that the end 
user never gets to see. 

Some technologies allow you to 
embed the published model directly 
within the existing content of the site, 
whereas others don't. Some wont even 
allow you to do either; you literally have 
to download the interactive world. There 
are pros and cons to all methods: 
instead of forcing the content onto 
people, you could give them a choice of 
whether or not to view it (a little like 
having the option to download a movie); 
or you could embed the content within 
the existing page so it appears seamless 
and not like an ‘add-on’ to the existing 
content. As with all new technologies, if 
it doesn’t come as standard with the 
main browser software, a plug-in will 
have to be downloaded. Again, if you 
haven't got much bandwidth, 
downloading a 5MB plug-in to viewa 


200K interactive 3D object doesn't 
make much sense. As a result, some 
technologies enable you to 
automatically download the plug-in in 
the background while the content is 
being downloaded. This may take the 
form of a simple installation that is 
prompted when it is downloaded. The 
main problem with this method is that 
some companies, mainly large 
corporations who have the bandwidth 
and the equipment to view online 3D 
easily, do not allow you to install 
additional software. Some won't even 
allow you to write to the main hard drive 
of the system except within one 
temporary ‘scratch’ folder that gets 
wiped every night or every week. 


Web 3D pros 

With these negative aspects to Web 3D 
content, is it worth it? The short answer is 
yes, which will come as a relief to those 
of you who've spent good money on this 
magazine. It’s an interesting and viable 
medium that will undoubtedly sky- 
rocket now that systems and bandwidth 
exist to cope with the specifications 
required to display and interact with this 
medium. The technology is being 
adapted constantly — some with 
collaboration and multi-user 
interactivity — and with so many different 
types being produced year after year, 
developers are sure that this is the way 
forward. It is only a matter of time before 
most Websites have 3D interaction in 
one way, shape or form, so you, dear 
reader, are taking the first of many steps 
towards a brighter 3D world. EEE) 
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plane in plasma 


Create and export this plane model for Flash 
and Director using the demo of plasma on 
our cover CD. Chocks away! 


iscreet’s plasmais a fully 
functional piece of 3D kit 
i f | that is streamlined, 

" optimised and designed 
specifically for the Web developer. It 
also comes fully equipped with two 
renderers (raster and vector), a 
Shockwave exporter, hard body 
dynamics and more kit than you can 
shake a very large stick at. But we arent 
going to be using many of these features 
here, because this tutorial is all about 
getting to know that ever elusive Z axis. 


If you're a Web developer, or are just 
getting into multimedia, you may find 
that working in 3D is a daunting 
prospect; it need not be. Most Websites 
have some element of 3D incorporated 
into them, but the majority of these are 
just simple geometric shapes extruded 
and animated in Flash. While most 
Web developers aren't all that skilled in 
the third dimension, it is a progression 
that most will have to undertake at some 
point, so there's no time like the present 
to get started... > 
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Part 1: Creating the basic shape 


First, you'll create the basic plane hull and the nose cone... 


3ds max 4 user? 


Although this tutorial is designed 
for plasma, users of 3ds max 4 
and above should have no 
trouble reproducing its steps. 
Unfortunately, unless you also 
own plasma, you won't be able to 
perform the Shockwave export 
or Flash rendering steps at the 
end of this tutorial. 


Getting your 
timing right 

If you feel like it's going to take 
you longer than two hours to 
follow this tutorial, split it up into 
chunks. The plasma demo 
included on the cover CD is 
time-limited to two hours per 
day, so use the time wisely — you 
don't want to be halfway through 
a process when it runs out! 


3D on the Web 


The plane's geometry is quite simple. Begin 

with a simple geometric shape that you can 
re-work and edit to your liking to achieve the end 
result. Open plasma and press W to get to the full 
Quad Viewport view. Create a cylinder in the front 
viewport with a Radius of 100, a Height of -500, 6 
Height Segments and 8 Sides. 


| Ell 


4 | Repeat this process a few more times until the 
end of the cylinder has a rim and a flat central 
piece. Extrude again and outline inwards to create 
the boundary of the nose cone. Extrude out a few 
times, outlining to create the curve of the cone and 
collapse the final extrusion to a point. 


Create the foot in a similar manner. With the 

base polygon selected, extrude and outline 
polygons until you have the basic shape. Then 
taper in the rear of the polygons by selecting the 
rear vertices of the foot and scaling them along 
the X axis. 


Name the cylinder ‘plane’. Right-click the 

cylinder and convert to Editable Poly. In Vertex 
sub-object mode and in the top or left viewport 
move the vertices so that they resemble those in the 
screenshot above. This is just a basic guide as to 
where your plane's features will be. 


5 | With the nose cone done for now, you need to 
concentrate on adding detail to other areas of 
the plane. Select the rear two polygons on the top 
of the cylinder and extrude them. Select Vertex sub- 
object and Target Weld the inner vertices to the 
middle ones to create an angled windscreen as 
shown in the screenshot. 


8 | Next you need to create more extrusions at 
the rear of the plane to add additional detail. 
Select the rear polygons of the plane and extrude 
four times by the same amount by entering an 
amount in the Extrude spinner’s text entry field 
(about 70 per extrusion should suffice). 


3 | Select Edge sub-object mode and select the 
edges at the end of the cylinder. Chamfer these 
slightly. Select Polygon sub-object and select the 
end poly. Extrude this ever so slightly by selecting 
Local Normal as the Extrusion Type and simply 
clicking on the Extrude spinner. Amend the Outline 
spinner to bring in the sides of the new polygon. 


G A little more complex this time but still the 
same procedure. Create the initial part of the 
front leg of the plane by selecting a couple of 
polygons close to the underside of the cylinder. 
Extrude and target weld the vertices of the rear of 
the leg to create a diagonal. Extrude another 
polygon before you create the foot. 


9 | In the top viewport, select one side of the 
plane and delete the polygons. This will allow 
you to work on just one side for the moment as the 
opposite side can be easily recreated later on when 
you need it. 


Part 2: Building the tail 


Now you've got the basic shape, concentrate on adding more detail to the rear of the plane... 


Unsupportive 


Be warned that if you want to 
bring the resulting model into 
3ds maxat a later date, you will 
have to model the plane in max 
itself. 3ds max does not support 
the plasma file type, yet plasma 
willimport a 3ds maxfile. 


i Create the edges of the cockpit window by 
target welding the vertices to create a diagonal 
line from the base of the cockpit to the top of the 
plane. Continue this towards the rear of the plane 
and move up the underside of the plane as 
illustrated. Select the edges around the cockpit and 
chamfer them to create a slight ledge. 


Bring in the top polys and extrude twice. 
Target weld the middle vertices as illustrated to 
create a diagonal toward the rear of the plane. To 
remove any harsh lines of the rear engine intake, 
select the edges of the tapered engine and chamfer 
them slightly. 


Delete any rear polygons of the plane as 

shown as they need to be recreated to form a 
point later on. Sculpt the rear of the plane so it is 
more tapered to a point by tweaking the odd vertex 
position or two, or moving and scaling polys or 
edges. Additionally, drag the bottom vertices of the 
nose cone down slightly to make the front of the 
plane more bulky. 


G In the left viewport, divide the edges of the 
side's rear top three polygons to create a 
diagonal up to the top right of the plane. Create 
edges using these generated vertices to create new 
polygons. Extrude the polygons slightly and target 
weld the vertices at the base of the extrusions to 
create a diagonal ledge at the top. 


G Target weld the fin's rear vertices so they form 
a point, as shown. Divide the edges of the rear 
fin, create new edges using the newly created 
vertices. Extrude slightly and drag out these new 
polygons. Amend the vertices of the new polygons 
to something resembling a small wing. 


8 | Select the polygons at the rear of the plane 
and extrude them. With them still selected, 
outline them to create two chamfered sections: one 
smaller section toward the front of the plane and 
the other larger one at the rear. On the underside, 
again ensure the vertices line up along the seam 
and delete the unwanted polygon to create a 
continuous open side. 


3 | Select the top rear three polygons behind the 
cockpit, extrude up slightly and bring out the 
vertices to create a slight lip. Perform this another 
three times to create a rounded cylindrical shape, 

tapered at the front end to generate the shape of 

the rear engine intake. 


G Select the front polygon of the engine intake, 
extrude slightly by clicking on the Extrude 
spinner, and outline to create a rim. Extrude slightly 
again and drag the resulting polygon inwards 
slightly. Chamfer the harsh edges if required. Ensure 
the vertices line up down the middle of the plane to 
create a nice seam for welding the two halves 
together later on, and delete the inner side polygon 
of the intake so the inside edge is open. 


@ In Vertex sub-object mode, move the vertices 
along the back of the rear engine to create 
new vertices along the seam. Using these new 
vertices, create new polygons, working in an anti- 
clockwise manner to ensure the polygons aren't 
flipped. Clone the plane, mirror it and attach it to 
the original. Select the vertices along the middle of 
the plane and weld. Create vertices and polys as 
before for the bottom rear of the plane. 
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Part 3: Adding wings and struts 


Finishing off the detail to the rear of the hull and adding the wings and support struts... 


Familiar interface 


As plasma is designed for the 
Web developer, its user interface 
is tailored for these needs. 
Existing 3ds max users will 
notice a similarity, yet will 
wonder where some items have 
gone, Think Photoshop or 
Dreamweaver user interface and 
all will be well. 


Special effects 


For the Flash render, add extra 
detail to the scene by creating 
some basic special effects. 
Tracer fire can be easily created 
using a simple particle system, 
with the speed cranked up and 
with a small surface area. Link 
this to the plane's gun turrets 
and as the plane is animated 
around the scene, the particles 
will be emitted. However, 
particles are not supported by 
the Shockwave exporter. 
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as Using these new polys at the bottom rear of 
the plane, extrude slightly and outline to 
create an inset. Extrude again and taper the 
extrusion slightly. Perform this operation another 
two or three times, and collapse the final 
extrusions to a point. 


4 | Divide edges to create the rough shape of the 
wing on the side of the hull and create edges 
using these vertices to generate polygons. Extrude 
and move these polygons out from the plane's hull. 
Perform twice more, then target weld and move 
vertices until the desired shape is achieved. Chamfer 
the pointed edge of the wing. 


To create the wheel, select the underside 
polygon of the foot, extrude and inset. Amend 
the vertices so a rectangle is formed. Extrude this 
rectangle another four times. In the left viewport, 
scale the vertices to form a semi-circular shape. 
Chamfer the edges of the leg to remove any sharp 
edges as shown. 


2 As with the front of the rear engine, chamfer 
the outer edges, extrude and outline the rear 
polygons slightly (being careful not to create an 
overlap of polygons when performing the outline) 
and extrude slightly. Drag this final extrusion back 
inside the engine to create the outlet. 


5 | Weld the vertices of the rear of the wing as 
shown so they form a pointed edge. Select the 
edges where the wing meets the plane's hull and 
chamfer them slightly to remove the harsh join. Add 
more curvature to the front of the wing if desired by 
chamfering at the same time as the wing/hull join 
chamfer. Add additional edges in the wing as 
required to remove polygon distortion. 


8 | To add alittle more character to the plane, 
select the chamfered polygon on the wing and 
extrude it. Target weld the inner vertices to the wing 
to form a point to the end of the wing. Reposition 
the vertices in the top viewport as necessary to 
achieve the desired look. 


i 
£y Delete the other side of the plane as before. 
Select one of the front polygons as illustrated 

and extrude out. Target weld the vertices to create 
an extruded triangle. Perform this again and finally 
extrude the polygon outwards so it runs slightly 
parallel with the plane's hull. Chamfer, extrude and 
outline as before to create an inset polygon for the 
exhaust. To prevent polygon distortion, create new 
edges alongside the base of the exhaust as shown. 


i 


G To add the support strut, extrude a polygon on 
the underside of the wing slightly, outline and 
reposition it. Extrude this smaller polygon several 
times, rotating as you extrude so the end polygon is 
close to the front wheel support. Extrude slightly, 
delete the two adjoining polygons and target weld 
them together. 


9 | Next add the small machine guns mounted on 
the plane's wing. Select two of the front 
polygons of the wing, and extrude and inset using 
the By Polygon extrusion type. Re-shape the 
polygons to form squares and inset the resulting 
polygons back to create a recession. Extrude to form 
the gun's barrel, then outline an extrusion and 
extrude back to form an inset. 


Part 4: Exporting the finished model 


Add the final details to your mesh, and you're ready to take to the skies! 


Export limitations 


Smoke trails can be created 
using simple tapered cylinders or 
cones with a noise modifier 
added to randomise the 
positions of the vertices 

Again, if this modifier is 
animated, the Shockwave 
exporter will not support the 
animation. Check the manual for 
more information about 


Shockwave export limitations. 


a 
1 | Select the edges of the cockpit windows and 
slightly chamfer them. Select the resulting 
inset polygons and extrude them backwards slightly, 
ensuring that no polygons overlap. 


4 | A slight clean-up operation is needed next. 
The chamfering around the cockpit 
windscreen beams had been left up with stretched 
polygons. Add additional edges to remove the 
stretching on both sides of the plane and tidy up the 
polygons in the middle of the cockpit by dividing 
the centre edge, creating new horizontal ones and 
deleting the diagonal edges. 


Build the tank's stem in the same way as the 
wheel, by chamfering a vertex and extruding. 
Create the main barrel separately by either creating 
polygons separately and welding, or creating a 
separate cylinder, chamfering the ends to curve 
them, and attaching and welding it to the stem. 


& With the majority of your plane almost 
complete, you can now re-attach the other 
side of the plane. Copy the plane object, mirror and 
attach it to the original. Weld the seam down the 
middle of the plane, ensuring that there are no 


overlapping polygons, two-sided polygons or holes 
in the mesh. 


Ga The wing comes to a point, as do the vertices 
running to the rear of the plane. To create one 
long ridge, select the vertex and chamfer it. Delete 
the resulting polygon and target weld the vertices 
together to form the ridge. Perform the same 
operation on the opposite side of the plane. 


Create materials for each element of the 

plane: the hull and wings, windows, engine 
intake, propeller nose, tyres, etc. Select these 
individual elements in Polygon sub-object mode and 
assign the materials to the selected polygons. Open 
the render dialog and change the renderer to Flash 
Renderer. Change the style from the Global Settings 
menu to your own tastes and render off the scene. 


To add a little more detail, select the front 
polygons of the plane — the area around the 
nose cone, just before the exhaust pipe. Simply 
extrude these polygons using Local Normal 
Extrusion Type to create a slight outset of the 
nose cone. 


G Create the rear wheel by chamfering the vertex 
to generate a polygon. Extrude this poly 
slightly, move and rotate it so it forms a slight angle. 
Continue extruding and outlining/scaling to form 
the shape of the wheel. 


@ You can also export this model to Shockwave 
by selecting Publish Shockwave from the File 
menu. In the Export Options box, amend the 
compression settings as desired (not much 
compression is required due to the model having a 
low poly count). Enter a filename and export the 
model. Check on View after export if you'd like to 
see the model in a Shockwave window. GEES 
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On this month's CD: a full working version of the world’s most powerful 
3D application. Contains every tool from Houdini Master, Halo and Select 
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DYMO ENGINEERING 


1. This image was created for the second Infinity series for Digital Vision, which will be 
released early next year. Joost explains: “For this project, | am working in collaboration 
with Chris Hewitt of Dstrukt.net to create a full CD with layered PSD files that can be 
used for commercial purposes by clients.” 


2. Another of Joost's images for Digital Vision's royalty-free collection, Infinity. 


3. This image was created for the cover of a brochure for Dymo Engineering. Joost 
elaborates: “The style fits very well with the Virtual Engineering work that Dymo does. 
The 3D products you can see here are designed by them in a program called 
Pro/Engineer. They were exported as STL files that | can import into 3ds max and 
render in the way that | want.” 


4. This series of images was created by layering renders in Photoshop. 


5. Joost created this Al poster for Derush — [w] www.derush.com - and it will be on sale 
shortly. He says: “The brief was to make something in my renascent style. Other than 
that, | had total freedom. | started modelling in 3ds max, making a huge mystical 
structure: a sort of lost city built out of metals and surrounded by fire-like atmospheres. 
| named it Hephaestus after the Greek God of smiths.” 


6.“A collection of stills from my latest animation project Jenovah, a three-minute 
animation where | try to provoke a mysterious eerie feeling to the viewers,” explains 
Joost. The animation took Joost months to create, including over 200 hours of render 
time in 3ds max. Check it out at [w] www.renascent.nl 


7. These are stills from Joost's Website at [w] www.renascent.nl. He laughs: “The site is 
never finished. | believe the current revision is nine or ten, and it has only been online 
for a year. It is first and foremost my personal outlet — a place without any restrictions or 
regulations, where | can be myself and do whatever | want.” 
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Joost Korngold 


2 “When something becomes a process of ‘tricks’, the challenge of 


exacting and thoughtful artist... 


oost Korngold is a graphic designer, Web 
artist and animator, based in Vlijmen, The 
Netherlands. He has recently started a 
freelance career, which has already seen 
some diverse projects: a T-shirt design for 
stereography.com, a poster for derush.com, royalty- 
free images for Digital Vision and Graphicscene.com, 
and some corporate design. Joost has also turned his 
hand to writing, and has completed a chapter for After 
Effects Most Wanted, published by Friends of Ed. His 
text details the steps used in After Effects to create 
Joost's latest animation project, Jenovah. 

Awork experience placement during his school- 
days determined Joost's career path at a young age. “| 
worked at a Web design agency where | got introduced 
to the work of vir2l, the Attik, and Websites from Jens 
Karlsson and Anthony Kyriazis. It really inspired me to 
move into this field,” he explains. Despite the current 
industry downturn, Joost remains positive about his 
work: “3D digital abstract is a visual style. Whether the 
market is good or bad, a style is used to visually 
strengthen the philosophies, visions and solutions that 
a company wishes to communicate to its target 
audience. A visual style and target audience often go 
hand in hand.” Although Joost doesn't fear for his style 
of work, he does have a contingency plan. He smiles 
and says: “I will also move into print design.” 

Graduating in graphic design from Sint Lucas in The 
Netherlands in 1999, Joost found the course hard 
going. “Most of the lessons were too linear and boring,” 
he explains. “However, | was introduced to the work of 
Tomato and Designers Republic by a teacher and that 
really opened my eyes. It showed me that there were 
other ways of communicating than those being taught... 

“The most valuable lesson you need to learn is the 
difference between doing a job and practising your 


making something new often falls short...” Joost Korngold is an 


hobby. Working means solving problems for others and 
not just making a pretty picture.” 

Joost creates his dark and mechanistic images on 
his Dell Pentium 4, using a combination of his most 
trusted software. “When | have a new idea | start by 
jamming in 3ds max,” he says. “For still images | save 
the renders as Tiff format and use these files for 
layering and editing in Photoshop. For animations, | 
render the sequences as QuickTime, and layer, edit and 
composite them in After Effects. It is a constant process 
of refining techniques and exploring new ones.” 

Videogames, such as the Final Fantasy series, and 
Greek mythology inspire a lot of Joost’s work. “They 
both carry this very dark and atmospheric feel,” he 
explains. “It is the subtraction of 2D design elements 
like small type, grids and lines that was often seen 
before. So it is the 3D shapes, with the usage of light 
and composition, that make my work stand on its 
own.” Joost is quick to give full credit where it’s due: 
“To my knowledge, this distinctive style was first 
created by Nathan Flood of nginco.com, who | 
hugely admire.” 

For the time being, Joost is concentrating on his 
freelance career but he does have other plans forthe 
future. “| am hoping to contribute to more books as | 
really enjoy writing about personal projects, thoughts 
and techniques,” he admits. Also, in his own 
understated, laidback fashion, Joost has set his 
sights on his long-term ambition of broadcast design. 
Watch out Tomato... EEE 
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hen Flash MX was launched 
into the Web design 
community, many designers 
were disappointed that their 
favourite tool hadn't been upgraded with 
3D tools as they might have wished. 
This was arguably a good move on the 
part of Macromedia because the 
__ software went onto become much more 
functional tool through the 
grading of its ActionScripting engine 
than being enhanced with 
[tools to create flashy effects 

not lost for Flash 


For designers working in three dimensions, Swift 
3D offers the best tools for learning the art of 
Web 3D and exporting the results into Flash... 


second version and offers such users 
just the tools they need. 

Working with a separate application 
to create 3D objects, rather than 
including this feature in Flash, offers 
many advantages — Swift 3D provides 
dedicated tools that would make Flash 
an even more complex beast. Swift 3D is 
never going to challenge the might of the 
more dedicated 3D tools on the market, 
but its ease of use and the way it enables 
you to export its results into SWF format 
simply cannot be beaten. 

Whether you're a newcomer to 
working with 3D objects or an old hand 
at the art, this tutorial will walk you 
through the software interface and 
demonstrate how a bit of rotating eye 
candy can bring life to your site. > 
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Part 1: Getting started with Swift 3D 


A little familiarity with your working tools can go a long way... 


Importing formats 


Although Swift 3Dis unlikely to 
threaten the big 3D tools, it does 
hold its own when it comes to 
ease of use and vector export 
capabilities, making it the ideal 
tool for most Flash designers. 
Add to this its ability to import 
3DS and DSF files as well as Al 
and EPS formats and you'll find 
Swift 3D is a worthy addition to 
your design toolkit. 


Interface 
customisation 


If you really aren't happy with the 
default layout of Swift 3D's 
interface, simply drag 
components around until they 
either dock somewhere a little 
more suited to your preference or 
leave them free floating. On lower 
resolution monitors, for example, 
leaving the Properties panel 
floating provides a noticeable 
increase in the amount of space 


given to the viewports. 


3D on the Web 


Se Open a new blank file and many of Swift 3D's 
features appear. Take a moment to familiarise 
yourself with the interface. Mac users should be 
automatically presented with a blank file, but PC 
users may need to do this either through the File 
menu or by using the toolbar shortcuts. 
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G Each of the viewports has reference grids to 
help with the orientation of your objects: red is 
for the X axis and green is for the Y, while the blue 
line shows the Z axis, or depth, of your object. 


Click on the Create Sphere button in the 
toolbar to add an object to the viewport, and 
notice how the individual properties appear. These 
provide options such as controlling the dimensions, 
position and appearance specific to that object. 


head of the interface. The Scene Editor is the 
default working space although there are options to 
work in the new Extrusion and Lathe Editor modes. 
There's also improved control over the preview and 
export of your work via a dedicated editor. 


a The main toolbar provides options for opening 
new and existing work, inserting text and 
primitive objects to your scene plus lighting and 
camera controls and options. The Animate button 
toggles Swift 3D in and out of Animation mode 
bringing the timeline to life. 


The Rotational Trackball occupying the bottom 

left of the interface provides rotational controls 
over a selected object — simply clicking and dragging 
this will move the selected object. Use the buttons 
to the left to constrain movement or those to the 
right to reset movement. 


Notice the new tabs added to Swift 3D v2 at the 


The two main panes dominating the Scene 

Editor interface provide viewports of how a 
camera would see your work. Clicking the top-right 
button in these views allows access to the seven 
default camera views to which you can add Free and 
Targeted Cameras should you need them. 


To the left of the interface the Properties 

toolbar provides similar contextual options as 
you can find in Macromedia's MX titles. Access to 
the Layout, Camera and Environment options is 
always available for editing these global settings. 


9 | The Lighting toolbar next to the Rotational 
Trackball is used for creating lighting schemes. 
The left buttons again constrain movement while 
those to the right add or remove point and spot 
light sources to your scene. 


By default, the Gallery toolbar contained 
within the bottom right of the interface 
provides preset drag-and-drop colour schemes and 

materials that can be attached to your objects. 
These include glossy and matt finishes, specular 
colours as well as various shades of regular hues. 
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11 | Preset animations are also available by 
toggling over to the Animation palette via the 
eRain logo to the left of the colours. Click on the 
thumbnails to see how the animation might affect 
your selected object. 


12 | The final component of the interface is the 
Animation toolbar, which comes to life through 
clicking the Animating button on the main toolbar. 
This keyframe animator is used to animate position, 
pivot, rotation, scale and materials. 


Part 2: Using the Extrusion Editor 


Using two-dimensional tools to create quick 3D effects... 


Wingdings 

Using graphical fonts such as 
Wingdings, Webdings and 
Dingbats is a quick and easy way 
of adding 2D shapes. Use the 
Create Text tool, select the font 
face and enter the character. 
Then take it into the Extrusion 
Editor to promote it to a working 
3D model. 


Freehand technique 


The tools available in Swift 3D 
for drawing shapes are basic, so 
you might want to work out on 
paper where key points should be 
mapped before using the 
Extrusion or Lathe Editors. 
Alternatively, you might prefer to 
use other tools to create such 
elements — Swift 3D can import 
Aland EPS files, which makes 
life much easier. 
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Open a new file and go into the Extrusion 

Editor mode through the corresponding tab at 
the head of the interface. You are now presented 
with an empty canvas and a selection of simple 2D 
drawing tools. 


4 | With the shape selected, go back into the 
Extrusion Editor and use the pen tool to 
create a box around your original shape. This 
modification turns your original shape into a cutout 
of the larger box. 
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2 | The basic idea behind the Extrusion tool is that 


the effect appears around a drawn 2D shape 
back in the Scene Editor. The grid is mainly for 
reference although your shape's pivot point will be 
placed at the XY intersection. 


You can continue like this creating quite 

complex effects. You can also use the 
Properties toolbar back in the main Scene Editor to 
further configure the size, material, positioning and 
bevel to get some effective and quick results. 


With a shape created in the Extrusion Editor 

you can move back into the main Scene Editor 
to see the results. Here you can add colours and 
textures simply by dragging and dropping them 
from the Gallery toolbar. 
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6 | You can then break down shapes into their 
constituent parts should you want to add 
different colours to its various components via the 
Arrange>Break Apart command. You are now free 
to work with the elements individually and can 
group them again later via Arrange>Combine. > 
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Part 3: Using the Lathe Editor 


Using a woodworking concept to visualise 3D objects... 


Five-sided 
pyramids? 


Using the Create Pyramid button 
will automatically generate a 
standard four-sided pyramid, but 
what happens if you want to 
create one with more or less 
sides? Create a simple cone using 
the Lathe Editor, uncheck the 
smoothing property and adjust 
the Radial Segments to equal the 
number of sides you need 


3D on the Web 


oe The Lathe Editor uses similar tools to the 
Extrusion Editor, although you need to 
consider the green vertical line as being an axis of 
rotation that your object will be based around. If 
you remember back to school woodworking classes, 
you might grasp the concept easier. 


Shapes are not restricted to being connected 

to the central axis. Use the Shape tool to select 
your shape and shift this away from the central 
point; if necessary, close the shape and further edit 
the corners. 


What if you want objects that don't have that 
circular lathed appearance? Select the Lathe 
properties in the Scene Editor and notice the 
Segmentation options. These allows you to modify 
the number of line segments your object consists of. 


Create a new file and access the Lathe Editor 

using the corresponding tab at the head of the 
interface. Draw a simple shape using the green 
vertical line as a central point and experiment with 
creating varying points to make a smoother finish. 


Back in the Scene Editor you'll see how your 

shape is rendered with the gap away from the 
central axis creating a hole through your object. The 
further from the axis of rotation your object is 
drawn, the larger your hole gets. 


8 | And if you uncheck the Radial Smoothing 
option, your object will consist of harder 
edges and flatter surfaces, allowing you to lose the 
lathed feel and create more sculpted shapes. 
Experiment also with the Sweep Angle option as 
this allows you to constrain the degree segment of 
your lathed object. 


When you're happy with your results, go back 

into the Scene Editor to view your creation. As 
you can see here, we've created a simple toadstool 
shape in a matter of seconds without needing to 
worry about the creation and relationships of 
complex shapes. 


Similarly, you can create shapes that pass over 
the central axis resulting in objects within 
objects. Try this out and zoom in on your object by 

pressing right-click (Windows) or Ctrl-click (Mac) 
and dragging anywhere on your scene where there 
are no objects. 
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9 | With this understanding of how the Lathe 
Editor works, you'll soon be experimenting and 
creating complex shapes in a fraction of the time it 
might take if you were to sculpt individual 
components by hand. 


Part 4: Exporting your work 


Using the Preview and Export Editor... 


Rendering 
wireframes 


To generate and export 
wireframe results of your objects, 
turn off the Fill Object option 
from within Swift 3D's Preview 
and Export Editor. You can turn on 
the Edge Option and generate 
outline versions of yourscene 
with no fills at all. 


Exporting to 
LiveMotion 


If your final work is intended to be 
used within Adobe LiveMotion 
then the sequential EPS export 
option is going to be the most 
efficient method of getting your 
MAX scenes to vectors. 
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Switch onto the Preview and Export Editor tab 

and familiarise yourself with this interface. This 
is where you will choose your output options, 
render your scene, preview and edit your animation 
and finally output your vector-based file. 


W Include Speoular Highlights 
IV include Shadows 


Through the General Output Options you can The Fill Options control how your scene is 


decide on the file type you want to export shaded. The Fill Type drop-down list offers a 
number of flat and gradient fills to choose from. 
If you decide to include Specular Highlights or 
Shadows, you will then need to choose your 
lighting options. 


your work as, the detail level which affects the 
speed of rendering and quality of your output, 
and the curve fitting for control over the 
smoothness of the render. 


Next, move onto the Render Preview section . 
to set options for your vector animation. Click 8 | Once the render has completed, you can use 
the Generate Entire Animation button and wait the Play controls to preview your final 

while Swift 3D renders the animation - this cantake animation before moving onto the export options to 
some time depending on the complexity of your the right. Simply choose your export preference, 
animation and the speed of your computer. name your file and click Save. 


Using the same logic as the Scene Editor's 

Properties Options, the Output Options to the 
right provide control over general settings plus Fill 
and Edge Options. Highlight each in turn to see 
what is available under each heading. 


G The Edge Options allow you to choose 
whether to include edges in your file. If you 
check the Include Edges box, you have a choice 
whether to include Hidden or Detail Edges while 
your Line Weight and Colour allow you to control 
how your edges are finally rendered. 


You'll now have the final rendered SWF 

animation that can be imported into Flash as a 
series of consecutive frames ready to be integrated 
into your main Flash movie. FEES 
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Select Operating System 
Cobalt RaQ 


nin 


The original "Web-in-a-box" solution. 


per month 


Red Hat Linux is the industry standard for 
web hosting. 


er mony 


Microsoft Windows, the choice of small and 
large businesses alike. 


Sun Solaris 


nontt 


per me 
The market leader for reliability and performance. 


Your servers safe in our Data Centre. 


Your peace of mind. 


Select Specification 


RaQ 128 

128MB/20GB/5 GB Data Transfer 

RaQ 256 

256MB/20.4GB/20 GB Data Transfer @ac> 


RaQ 512 

512MB/30GB/30 GB Data Transfer @a > 
RaQ 550 Qa 

256MB/40GB/15 GB Data Transfer 
512MB/2x80GB/25 GB Data Transfer 


NEW 
Celeron 1Ghz/128MB/40GB/10 GB Data Transfer 
NEW 
PIll 1.13Ghz/256MB/60GB/20 GB bata Transfer 
NEW 
PIll 1.266Ghz/512MB/80GB/30 GB Data Transfer 
NEW 
2xPlll_ 1.4Ghz/512MB/2x18GB SCSI Hard 
Disks running RAID 1/35 GB Data Transfer 
2xAMD Athlon 2Ghz/1GB/4x36GB SCSI Hard 
Disks running RAID 5/55 GB Data Transfer 
r NEW } 

2xIntel® Xeon® 2Ghz/2GB/4x72GB SCSI 
Hard Disks running RAID 5/80 GB Data Transfer 


2xUltra Web Servers/Ultra || Database & 
Ultra Il Mail Server/100 GB Data Transfer 


3xUltra Il Web Servers/Ultra Mail Server/ 
Enterprise Database Server/ 
250 GB Data Transfer 


4xEnterprise Web Servers/Xeon Database 
Server/Enterprise Mail Server/ 
400 GB Data Transfer 


Sun Fire V100 128 @ap> 
500MHZ/128MB/40GB EIDE/ 
20 GB Data Transfer 


Sun Fire V100 128 1GB @aD 
500MHZ/1GB/2x40GB EIDE/ 
30 GB Data Transfer 


Your server safe and secure in our Data 
Centre. Choose from a range of data transfer 
(bandwidth) per month and benefit from 
24/7/365 unlimited technical support. 


Teas 


Select Security 


Uper month 


Protect your machine from unwanted visitors. 
Web based control panel allows you to add 
rules and deny undesirable visitors. 


per month 
I per month 
Running databases, holding customer 
information or involved in e-commerce? If 
your answer is "yes" then order backup now 
and benefit from free restores if required! 


per month 


The ultimate tool for knowing how your 
server is operating and running. Pre-empt 
critical failure and minimise server downtime 
with messaging via e-mail or SMS. 


per month 


Firewall, Daily Backup and Advanced 
Systems Monitoring bundled to save over 
£600 per year! The complete solution to your 
Web hosting security. 


ed 


Relax with... " 


Unlike most of our competitors we do not 
charge for technical support or aftersales 
service. Available with every Dedicated 
Servers product, you can call or e-mail our 
support team on an unlimited basis, 24/7/365. 


Standard SLA: 

Our Industry leading SLA is your guarantee of 
a totally reliable service. We'll pay you if it's 
not! Benefit from 99.9% connectivity, 30 
minute reboot guarantee, 1:1 contention ratio 
on bandwidth and a price freeze-forever! 


Advanced SLA: 

Specially tailored for Enterprise level services 
and above, the Advanced SLA is perfect 
for mission critical sites. Backed by a 
money back guarantee, benefit from 
99.999% connectivity, two hour hardware 
resolution, 30 minute reboot guarantee, 1:1 
contention ratio on bandwidth and a price 
freeze-forever! 


Product Focus 


weBppliance 


Pinu version aa 


h 


ajuelddg3an 


rd wEBppliance 


@indows Version a 


Free Ensim software pre-installed and ready to run on every 
Linux and Windows server! 


This industry-leading, web hosting platform allows our resellers and customers to manage their 
hosting environment and administer their server with no technical ability. Ownership of the 
administrative functions and configuration of your own server will delight your customers, 
maximize performance and minimize costs. Ensim will transform your Dedicated Server into an 
easy-to-use, web hosting appliance that's ideal for web developers, designers and single site 
users alike. 


For resellers: For single site users: 


Set-up shared hosting accounts Your own server (no sharing!) 
Control panels for your customers Easy back-up & restore 
Integrated DNS support Web-based e-mail 
Full bandwidth management Detailed on-line help & manual 
¢ Customisable private label control panels Real-time web-based control panels 
SSH Access 


Free with Linux & Windows Servers 


Contact Us 


Ww: 
We constantly monitor the competition and know we offer the best value, feature-for-feature dedicated 


hosting in Europe. We are after all, the generic name associated with scaleable, secure hosting. We 
will beat any like for like quote...try us! 
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supporting 


online Eurore 


for business 


“> 
& ¢ Call us and place your order via 
7 credit card or direct debit before 
4:00 p.m. (Monday-Friday) and 


we'll have your server up and 
running on the same day! 


Our UK Data Centres are 
designed, owned and managed 
by us. Situated in London and 
Nottingham, they benefit from the 
latest security, backup, power 
and climate control features 
available. 


i> I At Dedicated Servers, we are 
committed to providing you with 


the highest levels of customer 
service, covering all aspects of 
the customer relationship 
including: | communications, 
accuracy, performance, privacy, 
security and complaints 
procedures. 


~~ 


Buy any RaQ4 (256 MB and above) and get 
a RaQ3 128 MB 


For a strictly limited period, Dedicated Servers 
will enable Advanced Systems Monitoring on 
your dedicated server absolutely free, forever! 
Available with every server over £199 per 
month! Call now and don't miss out! 


Your peace of mind. 
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Illustration: Dmitry Utkin [w] www.factory512.com 


Create a 
multimedia 
player with AXEL 


Freakish Kid has developed this 3D console- 
navigation device for Computer Arts Special. 
Watch and learn... 


XELedge offers designers movies created in a wide range of 

and artists a complete software packages, then build and 

authoring solution for high model in AXELedge, incorporating them 

impact interactive 3D Web all so that you end up with your own 
content. It enables you to model, interactive multimedia player. After 
animate, texture, light, preview, completing the following tutorial you 
integrate and publish interactive will be able to design and build your 
content directly to the Web. own multimedia player, leaving you with 

The following tutorial takes you step just one more problem to solve: How far 

by step through some of the areas of can you push your imagination? > 


interactivity. We show you how you can 
import from some of the more advanced 
3D packages, and avoid sharp-edged 
polygon models with jerky movements 
and poor quality graphics. 

You can incorporate original 2D and 
3D images from a wide range of existing 
software and seamlessly join them to 
give the best in Website design with the 
latest features that cutting edge 
software has to offer — all in one easy 
user-friendly package. 

You can import models, graphics and 


Follow our two AXEL tutorials and you should end up with a multimedia player like this... 
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Part 1: Setting the scene 


Learn the basics of working within AXEL... 


Easier working 


When working in AXEL you 
should remember to name all 
objects that you create as well 
as any other materials that 
you make or import. This will 
help your workflow and avoid 
any confusion when creating 


your project. 


3D on the Web 


Pi 


Before beginning, spend a few moments 

familiarising yourself with the AXEL interface. 
Looking at the Project Manager, Sequencer, 
Interaction Editor and Parameter Editor will help you 
to follow this tutorial. 
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Use zoom and pan to centralise your planes on 

screen — if you right-click in the WebCam1 
view>Hide Grid, this gives you a better view of your 
model. In the Project Manager rename ‘Plane 1' to 
‘Background’ and ‘Plane 2' to ‘Base’. Save your work 


= 
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In Project Manager select inner screen. In the 

Parameter Editor check the Visible box. Repeat 
for Remote group, as well as outer screen and 
Remote projection node. In AXEL, you can affect 
individual objects or groups as a whole. 
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Select the Top view and go to Model>Add 
Surface>Vertical Plane, then in the Parameter 
Editor set the position co-ordinates to 0.00, 8.00, 
-15.00. Change the scale to 3.00, 2.00, 2.00. Below 
this select PlaneGeometry1>Select>Horizontal 
subdivisions and change from 10 to 1. Repeat this 
for Vertical subdivisions. 


In Project Manager select Background then 

Visualise>Add Image Texture. Then go to 
the texture folder and select the image 
background.bmp and press OK. Repeat the same 
steps for Base and choose base.bmp 
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Now for the buttons. Go to Model>Add 

Surface>Sphere. In the Parameter Editor 
rename it as button’. Set its position to: 0, 1.3, 0, 
and its scaling to: 1.00, 0.75, 0.50. Duplicate this 
button twice (Edit>Duplicate) and rename them 
button2 and button3 (respective positions: 0.0,1.3, 
2.0 and 0.0, 1.3, 4.0). 


Select the Top view, go to Model>Add 

Surface>Horizontal Plane. In the Parameter 
Editor set Position 0.00. -2.00, 0.00. Change scale 
to 3.00, 1.00, 3.00. Then go to PlaneGeometry2 
and change the Vertical and Horizontal subdivisions 
from 10 to 1 


alate 


aie 


In Project Manager select DirectionalLight1. 

In the Parameter Editor enter the following 
Orientation: -20, 0, 0 (you are changing the light's 
angle). You can also toggle on the light's visibility 
and rotate the light source until you are satisfied. 


9 | These three buttons will play different movies 
on the screen. In Project Manager select 
button1. Go to Visualise>Add Colour 
Material>Shaded. Select a Bright Orange (RGB 255, 
128, 0). Change the material's transparency to 
50%. Repeat for button2 and button3. 


Part 2: Adding interactions 


Making sensors and hooking up reactions to them... 


Importable 
extensions 


AXELedge supports a wide range 
of files to import. Movies: MPEG, 
AVI, MOV and SWF; Images: 
JPEG, GIF, BMP and PNG; 
Sounds: MP3, MPEG, WAV and 
MIDI; 3D Models: VRML 97 
(version 2), LWS and LWO. 

You can also import EPS curves, 
with more file extensions to 


follow in the future 


View ports 


If you want to zoom inona 
specific object in one viewport, 
select the item and press F To 
re-centre your model in all 
viewports click off your model so 
that nothing is selected then hold 
Shift and press A. This zooms all 


four viewports at the same time 
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Now add in some 3D text. Go to Model>Add 


Text, type 1, press OK and accept the default 
font type. In Project Manager, a new item appears 
as Text1 (1). Select it and in the Parameter Editor 
enter Position -0.1, 1.5, -0.5; Orientation -90.00, 0, 
0; Scale 0.50, 0.50, 0.50 


‘HED GRM eGo aye | 
@ 


4 | In AXEL, you create interaction by making 
sensors and hooking up reactions to them. In 
the Project Manager, select button1 and choose 
Interact>Add Sensor>Mouse. An orange box 
appears in the Interaction Editor. In the Parameter 
Editor, select pointing hand as a cursor type. Repeat 
for button2 and button3. 


Select button1, and then select its material. In 

the Parameter Editor, click on Transparency 
and choose Interact>Add Reaction>Toggle 
Parameter. Type 0 and 50 in the fields. This means 
that when first triggered it will go opaque (O per 
cent) and when triggered a second time, it will go 
back to being 50 per cent transparent. 


Repeat for button2 and button3 by adding 

two other text objects and dragging them 
under their buttons with the Scale, Rotate and 
Translate tools in the viewports. The final values for 
2 are: Position -0.1, 1,5, 1.5; Orientation -90, 0, 0; 
Scale 0.5, 0.5, 0.5. The final values for 3 are: 
Position -0.1, 1.5, 3.5; Orientation -90, 0, 0; Scale 
0.5,0.5,0.5 
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5 | You now get a reaction to hook up to the 
sensors. Choose Interact>Add Reaction>Play 
Sound and choose Static.wav. A blue reaction box 
now appears in the Interaction Editor. Expand the 
button1 sensor and drag a link from OnLeftClick's 
white triangle to the Play Sound reaction. Repeat for 
button2 and button3 
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In Interaction Editor link button1 sensor's 

OnMouseOver to this reaction. Select the link 
(the line that goes between the sensor and 
reaction). In the Parameter Editor, choose Trigger 
on: Hold. Now, when you first go over the button it 
goes opaque; and as you leave, it triggers the 
second toggle, back to semi-transparent. 
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Select Text1 and choose Visualise>Colour 

Material>Shaded, select the Blue RGB 0, 64, 
128. Repeat for Text2 and Text3. Now select outer 
screen and add a material — go to Visualise>Add 
Colour Material>Custom Wireframe. RGB value: 
255, 128, 0. Transparency: 77. 
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G To preview this content immediately, choose 
Publish>Preview in AXEL. Windows will grey 
out and you can now play in the WebCam window. 
Click on your buttons to make the static sound hiss. 
Choose Publish>Return to Author mode to go back 
You can also click on the web and spider icons to 
alternate between Author and Preview modes. 


Try it out in Preview in AXEL mode. Now that 
your remote buttons are functional, you need 
to make them change stations. Just as you applied 
textures to the planes previously, apply Movie 
Textures onto the inner screen. Anything QuickTime 
can read is fair game (.mov, .swf, etc.). 
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Adding interactions continued... 


Download estimate 


One of the most useful features in 
AXEL is the Download Estimate 
feature. Go to Project 
Manager>Download Estimates. 
You can select from a 28.8k 
modem to a DSL/Cable modem 
and your download time and file 
sizes are shown. For maximum 
efficiency, if you select Show 
Details then you can check the 
amount of data you have attached 


to your download priorities. 


Download times 


When using multiple objects like 
the buttons that have the same 
texture, you can select them all 
and then select the material that 
you have attached to your first 
button, then go to Visualise>Link 
Material. This acts in a similar 
way to an instance in helping 


keep your download time down 
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10 | Now you need to attach multiple movie 
textures to the inner screen of the Multimedia 
player. This allows you to link more than one movie 
to play on the same screen. Start by selecting the 
video planes group and toggle on its visibility. 
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13 | Movie Eye has now appeared as a reaction in 
the Project Manager. It is by default linked to 
Time O. Toggle on loop in the Parameter Editor. 
Unlink the Play Movie reaction by dragging off the 
link, Re-link to button1 sensor OnLeftClick. When 
button is pressed, it will play the movie. Link 
button2 sensor to Play Movie SWF and button3 
sensor to Play Movie Lava. 


Create two other SwitchMaterial reactions 

with inner screen & Movie SWF material and 
inner screen & Movie Lava material. Link button’ 
sensor's OnLeftClick to SwitchMaterial1 (Eye 
Movie). Link button2 and button3 to the two other 
SwitchMaterial reactions. 


rit | The next step is to create three new materials, 
one for each movie. Each orange button will 
make inner screen switch to the appropriate 
material. Plane2 and Plane3 already have their 
material and movie, so select Plane1 and choose 
Visualise>Add Movie Texture. Select EYE.mov. 
Reselect Plane1 and rename the material Movie Eye. 


In the Project Manager, expand 

Resources>Materials. You now have three 
different Movie materials (one for each of the 
three planes). Select the Dummy plane group and 
toggle off its visibility. 


17 wee the surfer the ability to swivel around 


the screen, select Interact>Add Handle>Orbit 
WebCam. Handles allow the surfer to control 
elements, like moving an object around, or in this 
case, the WebCam. By clicking and dragging 
anywhere in the window, they can now orbit 
around the scene. 
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Edit Movie Eye's transparency to 50, and then 
click on Texture Settings. Choose Texturing 
mode: Replace (this means that the texture is not 


affected by lighting, like a video screen) and enable 
Filtering (this blurs a rather low-res texture). 
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You now need to create three different 
SwitchMaterial reactions to view movies on 
the inner screen. In the Project Manager, Shift-select 
inner screen and under Resources>Materials, 
Movie Eye, choose Interact>Add Reaction>Switch 
Material. A new reaction now appears in the 
Interaction Editor. 
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18 | You can also create linear animations. Select 
the Remote projection node and choose its 
material. Animate its colour so it changes every time 
you click one of the three buttons. 


Part 3: Testing and previewing 


Watch your creation come alive... 


File sizes 


File size is relative to download 
times so we must keep it to a 
minimum. If you go to the Project 
Manager select the plane and 
then go to the Parameter Editor 
and select Plane geometry, you 
can alter the subdivisions from 
the default 10H x 10V to 1H x 1V 
saving 96 points and helping to 


keep the file size toa minimum. 


fe node (Remote projection node) J] 
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1 | Make sure that you are on Time 0.0. In the 
Parameter Editor, click on Colour (a dark red). 
Choose Animate>Add Animation Sequence. An 
animation track appears on the sequencer timeline 
with a keyframe at Time 0.0. 


lem 
4 | In the Interaction Editor, link it to each of the 

three button sensors OnLeftClicks. Every time 
you click on the button it will activate the animation. 
You can return to the sequencer and edit the values 
of your reaction or animations at any time 


Make sure Simulation is enabled and go into 

Preview mode. Notice how the textures on the 
planes take a fraction of a second to appear. Under 
Resources>I|mages, select background.bmp and 
base.bmp and disable streaming. 
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Move to Time 0.5 (you might want to zoom in 
on the timeline by dragging the slider towards 


the magnifying glass) and then change the colour to 
bright red (255 0 0). This will create a new 
keyframe. Move to time 1.0 and return to dark red 
(128 0 0). Turn off the red record button in the 
animation sequencer. 


G When in the sequencer, click on the Download 
tab (a wave-like icon). This displays the 
streaming of objects and allows you to edit their 
order and preview it within AXEL. 


Regulate the order in which the Movies 

appear. Under Resources>Movies, select Flash 
Movie and change the streaming priority to 
Medium. Change Lava Movie to Low priority. 


Drag the scrubber in the animation sequencer 

to verify your animation is correct. Notice how 
it is connected time 0 in the Interaction Editor. This 
means it will play right off the bat. This would be 
fine if you wanted to animate a light fade in or so, 
but in this case unlink it. 
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All animation and interaction is not streamed 

(it weighs next to nothing). By default, 
geometry is not streamed (you might want to 
stream heavy geometry). All textures and sounds 
are streamed by default. Click on the Download 
Stream track and look at the Parameter Editor. 
Notice the time estimates at cable connection - it 
will take 0.1 second for it to open and an additional 
1.1 second for all content to be operational. 
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In the sequencer, click on the Refresh button 

to see how it works out. Return to Preview 
mode and view the simulation. You can keep on 
tinkering with the content within AXEL, and 
experiment with the content just as the surfer will 
see it. Now publish the movie according to the 
settings on the screenshot. EEE 
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Get the full 
version of 
AXELedgel.0 


with the next 


issue of sister 
magazine, 
Computer Arts. 
Worth £670, the 
all-encompassing 
Web 3D program will 

be yours to keep and 

use. Get your hands on a copy of this 
exciting new look issue and you'll find 
six pages on how to use the product, 
plus an exclusive 30% reader 
discount off the latest version of 
AXELedge. On sale Oct 10, price 
just £6. 
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Using advanced 


techniques in AXEL 


Add interactions to the project you created 
in the previous AXEL tutorial to tailor it to 


your specific needs... 


nthe first tutorial we showed 
} you how to use some of the 

K basic features of AXEL, 
{i including modelling and basic 
interactions. We are now going to take 
you one step further and show you how to 
make your piece themed to your own 
requirements, maybe in the style of your 
Website or design. We will show you step 


> 


by step how to change the view screen 
surround and then give it interactive 
textures; following the same principles, 
you could apply similar techniques to 
alter the handset or buttons, etc. 

As you become more familiar with 
AXEL, you will realise that you can use 
the application to add interactions to any 
2D or 3D objects that you design. 


Part 1: Projection node and new screens 


In this first section we explain how to set up extra interactive view screens and a projection node... 


Geometry and 
download times 


Since download time is always 
crucial, remember that any 
surface you create (for example, 
sphere, cube, plane) will be 
lightning fast, since the only 
information that has to be 
transferred is the parameters of 
the object such as size, radius, 
subdivisions. Once you edit one 
or more points on that surface, it 


becomes a bunch of points in 


space, and therefore takes longer 


to download. 


Slicing and dicing 
AXEL objects 


You can subdivide an area of a 
surface by selecting points and 
choosing Model>Modify 
Surface>Subdivide. This will 
subdivide only the faces made 
from the points you selected, 
rather than subdivide the whole 
surface. Subdividing is crucial 
for everything from giving you 
more points and faces to model 
from, to adding edges to objects 
so deformations like Pushes and 


Bends are smoother. 


1 | Go to the Axel Advanced tutorial folder on the 
cover CD and open the file called Finished 
Tutorial 1. This should look like the version you 
created earlier. We have hidden the interactions and 
grouped the items in the Project Manager to save 
any confusion 
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4 | Now you have created the Shape Screen you 
will have noticed that it's been created 

centrally. In the Parameter Editor set these values: 
Position -9.28, 5.49, 7.98; Orientation 0.00, 0.00, 
0.00; Scale 1.00, 0.75, 1.00. Don’t forget in Plane 
geometry to set horizontal and vertical subdivisions 
to 1 and 1. 
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Select the Object icon. You are now ready to 
create the animation. Select the Shape Screen 

then highlight its Scale parameter in the Parameter 

Editor, set the scale coordinates to: 0.03, 0.75, 1.00 
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4 
We will now show you how to create a 

projection node. Go to Model>Add 
Surface>Sphere. In Project Manager re-name it 
Projection_node. In the Parameter Editor set its 
values to: Position 0.00, 1.30, 5.24; Orientation 
0.00, 0.00, 0.00; Scale 0.40, 0.40, 0.40. 


@ Streamable = No 
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G With Shape Screen selected go to 
Edit>Duplicate then in the Parameter Editor 

set the position for the duplicate to: 9.28, 5.49, 

7.98. Now go to the Project Manager and rename 

it Shader Screen. 


8 | Now go to the Animation sequencer and select 
the Animation button. When pressed you will 
notice that a PlayAnim sequence has been entered in 
the timeline. Drag the player bar to 5 in the timeline. 
Now go to the Parameter Editor and re-enter the 
scale co-ordinates to: 1.00, 0.75, 1.00. There is now 
a second keyframe placed at 5 in the timeline. 


View Belate 


on=0.0 00 0 
= 060 0.40 O4c 
Visible = Yes 
Antislasing = No 


3] Now you have created the node you need to 
give it a colour. Go to Visualise>Add Colour 
Material>Shaded, and apply a colour of your choice. 
You're now going to create the first screen. Go to 
Model>Add Surface>Vertical Plane. In Project 
Manager call this Shape Screen 
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G You now need to create an animation using 
the Shape Screen. Select the Shape Screen 
then select the centre icon from the top toolbar, and 
use the Select and Translate tool to move the centre 
point so that the Y axis runs straight up the left- 
hand side of the Shape Screen. 


You must now click on the Animation button to 

deactivate it. Then right-click in the Interaction 
Editor and choose Display or this will reveal the 
TimeSensor and PlayAnimation reaction. Since the 
animation will be triggered by a button, unlink the 
TimeSensor and the PlayAnimation reaction. 3 
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Part 2: Importing emitters and setting up new screens 


You now need to import your emitters and make them active while setting up the new view screens... 


Naming groups 
with capitals 


When you rename a new group, 
use capitals only. This will help to 
visually separate the Group 
category from other elements of 


the Project Manager. 


Graduated 
backgrounds 


An interesting alternative to a 
texture for your background, 
whether it's the sky, water or outer 
space, is using a plane with a 
colour gradient. Get a vertical 
plane, and limit its subdivisions 
to 1x1 in PlaneGeometry. 

Apply a material, then multi- 
select the top or bottom row of 
points and choose Visualise> 
Edit Point Colour, choosing a 


different colour. 


3D on the Web 


hensn [Tos | | a Dice DH) @ 
Entiopolation [None 


“Headndn oc 


as ele 


‘2 
© Position= 0.00 1 


@ Giiertation = 180. 


It's time to add another animation to the 

Shape Screen, which will be changing the 
transparency to 100. To do this, apply a material; 
suggested RGB 79, 198, 242. Open the Material 
settings in the Parameter Editor, select Transparency 
and change to 100. Make sure the current time is 
set to zero and click on Add Animation in the 
Animation sequencer. Move the animation slider to 
5 and change Transparency to 0.00 
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In the Interaction Editor unlink the Emitter 1: 

Scale animation from the TimeSensor and link 
it to OnLeftClick of MouseSensor 5. In Project 
Manager select Emitter>Visibility>Interact>Add 
Reaction>Set Parameter. In the Interaction Editor 
link the SetParameter reaction to OnLeftClick of 
MouseSensor5. 
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7 You now need to create the graphics buttons. 
Go to Model>Add Surface>Vertical Plane. 
Rescale to 0.18, 0.18, 1.20. Now set position to: 
-12.00, 6.90, 8.20. Rename to Screen_1 
Duplicate Screen_1 and set Screen_2 position to: 
-9.50, 6.90, 8.20. Duplicate this and reposition to: 
-7.00, 6.90, 8.20 


Next create the Interactive button to trigger 

the reaction. In Project Manager>Original 
Tutorial select Remote projection node. In the 
Interaction Editor right-click and choose Display 
selection. The MouseSensor appears — drop this 
open and link the two animation reactions to the 
sensor OnLeftClick. Now select the MouseSensor 
and choose Pointing hand as the Cursor type in the 
Parameter Editor. 
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5 | Go to Project Manager>Emitter 
1>Visibility>No. Once this is done you 

have one working screen, which is activated by a 

button. Using the previous steps (6 to 9 in Part 1, 

and step 1 above) as a guide, set an animation for 

the Shader Screen. Remember the Centre icon 

Once you have set the animation, unlink it from the 

TimeSensor. Now add a material to the screen 


Now you need to add the button textures. 

Select Screen_1>Visualise>Add Image Texture 
and locate Graphic 1 in the Axel Advanced tutorial 
file on the CD. Repeat for Screen_2 and 3, adding 
graphic 2 and 3 respectively. Now add interactivity 
to these buttons. Select Screen_1>Interact>Add 
Sensor>Mouse. Repeat this process for the other 
two buttons. 


3 You now need to import and animate your 
emitters. Go to the folder called Axel Advanced 
tutorial on the cover CD and import the AXEL 
project ‘Emitters’. We are now going to attach a 
material to them and alter the transparency so that 
it acts as projected light. Select Emitter 1 then 
choose Visualise>Add Material>Shaded and set 
Colour to RGB O, 255, 255 and Transparency to 55, 
then repeat for Emitter 2. 
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G Now you have set up the Animation and 
Visibility parameters to the Shader Screen 
Create the shader buttons to be placed on the 
Shader Screen. Create a vertical plane and change 
its scale to: 0.18, 0.18, 1.20 and position to: 9.34, 
7.88, 8.15. Duplicate and re-position seven more 
planes to these positions: 9.34, 5.50, 8.15; 9.34, 
3.03, 8.15; 11.98, 7.88, 8.15; 11.98, 5.50, 8.15; 
11.98, 3.03, 8.15; 6.70, 7.88, 8.15; 6.70, 5.50, 
8.15; 6.71, 3.04, 8.15 


9 | Group screens 1, 2, 3 and call them 
Screen_buttons. Now you need to make them 
appear when the Shape Screen is projected. Select 
Screen Buttons>Visible Yes>Interact>Add 
Reaction>Set Parameter. Now link this to 
MouseSensor5 OnLeftClick. Select the link and 
change Time delay to 5 in the settings found in 
Parameter Editor. 


Part 3: Final stages 


It's now time to apply an animated texture and do final previews... 


Tricks of the 
URL trade 


While you can only Publish as 
URL for Movies, you can in fact 
save large textures, or sounds, or 
any QuickTime compatible file as 
a MOV, then use this file as a 
movie and Publish as URL. This 
way, these other files can also be 
located remotely on the Internet 
and stream into your AXEL 


project as if they were movies. 


Upload dilemma: to 
binary or to ASCII? 


When uploading your AXEL 
stream files to your server, make 
sure you are using binary mode 
on your FTP client. Usually this is 
set by default, but some 
programs use ASCIl, or you may 
have changed your transferring 
mode yourself. Just switch it over 
to binary so everyone will get to 


enjoy your AXEL worlds! 


cae { » 


Turn off Screen_buttons visibility in the Project 

Manager. Now import outer screen design in 
the Original Tutorial folder in Project Manager. Turn 
off outer screen visibility. With this selected go to 
Interact>Add Reaction>Set Parameter; link this to 
MouseSensor6 OnLeftClick. 


‘6a disaH eco) — 


ose) 8 


jumber of pont 
streamable = Ni 
Cylindert1 FALE 
Cylinder 2-FACE 


4 ff ae 82 


@ Now go to File>Import Axel project>Axel 
Advanced tutorial>Rotating screen from the 
CD. Open up this new object in the Project 
Manager and select LineO2-FACES>Visualise>Add 
Colour Material>Custom Wire Frame. Set RGB to 0, 
0, 255. Now rename rotate blue. With LineO2- 
FACES selected go to Visualise>Unlink Material. 
Repeat this step for adding wireframe materials of 
0.00, 255, 0.00 and 255, 128, 0.00 


The next stage is to link the Screen buttons to 

activate the Shader Screen. Go in to the 
Interaction Editor and select MouseSensor6 
Screen_1 and link this OnLeftClick to: 
PlayAnimation5, Set Param4, PlayAnimation6, 
PlayAnimation7, PlayAnimation9, SetParam5. Now 
select LineO2-FACES Visibility and turn it 
off>Interact>Add Reaction>Set Param. Link this to 
MouseSensor6 also. Now turn Visibility off in the 
Parameter Editor. 


Press the Animate button then move the 

timeline to 2. Change the Transparency to 
around 80 then move the timeline to 4 and select 
Transparency O. Press the Animate button to de- 
activate. Go to the Interaction Editor and unlink this 
animation from the TimeSensor. 


KaadionH eaD, 


[asl ele 


Now that you have applied the wireframe 
textures to LineO2-FACES you need to add 
normal shaded materials with the same RGB codes. 
When you have done this, remember to use the 
unlink option so that you can apply the textures 
as a reaction. 


8 | Make a button using one of the planes in the 
third row of the Shader Screen. Select this 
mouse sensor to the animation set in section 25 and 
make the button active OnLeftClick. Make buttons 
using the remaining shader planes and add two 
more glow shaders. 


Now choose wire 1 in the Project 

Manager>Interact>Add Sensor>Mouse. Now 
Shift-select rotate blue and LineO2-FACES in 
Parameter Editor>Interact>Add Reaction>Switch 
Material. Repeat this step for adding the other 
rotate materials 
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For extra effect we will add an animated 

texture that we can apply. Select LineO2- 
FACES and apply a material RGB as before. Select 
this material and rename it glow1. In the Parameter 
Editor set its transparency to 0. Now go in to the 
animation sequencer. 


9 | Using the techniques learned in the previous 
steps, apply the textures to the other outer 
screen body found on the CD. When you have 
achieved this go to the Preview in AXEL icon to see 
your working model. EEE 
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The world’s biggest selling creative magazine - Mac & PC pe ae er 
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In issue 75 ~ 
> Illustrating with style: [urn everyday - 


imagery into your own eye-catching 
artwork with our exclusive vector tutorial 


>Scanography: [he stunning new 
Photoshop techniques you 
need to know 


> Jaw-dropping design: [hree top * 
illustrators and designers showcase 
their work and share their secrets 


>On the CD: VideoClix 1.3, worth 
£260. Plus 50MB of royalty-free 
sounds for you to keep and use 


ON SALE NOW 
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This is your chance to subscribe to omputer Arts Special for just 


£54. You'll get every issue delivered to your address, and more 


importantly, you'll save £24 on the deal. Phone our hotline today! 


Computer Arts Specials are certainly hot property — 
you'll find all the best techniques and tools for a variety 


of computer art disciplines: 


- 3D graphics - Flash - Dreamweaver - 
- Digital video - Web design - Photoshop - 


Each issue comes complete with a dual-format CD. 


Simply call our hotline, email us, or fill in the form on the right. 
(A photocopy will do) 


Make even greater savings 
by subscribing to 


f Computer Arts too! 
' Turn to page 94 for details. 


UK: 0870 444 8455 


quoting order code: COSP37 
Lines open 24 hours a day 
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Signature. Daten 


UK readers return this coupon (no stamp needed) to: Computer Arts Magazine, Subscriptions, 
Future Publishing Ltd, FREEPOST BS4900, Somerton, Somerset, TAI] 6BR. 


Overseas readers return (postage payable) to: Computer Arts Magazine, Subscriptions, 
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{J Please tick this box if you would prefer not to receive information on other offers. 


Order code 
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% 
<@ AaninDcanc 


3D on the Web | 51 


s this issue goes to press, the 
finishing touches are being 
applied to the Digital Arts 
World show, which promises 
iggest and most important 
creative event in the UK for 2002. 

Working in conjunction with our sister 
magazines Computer Arts, 3D World, 
Cre@teOnline, Edge and Computer 
Music, and with the support of some of 
the biggest names in the industry, we've 
put together a show that caters for people 
working in all the key fields of digital art 
and design. Graphic designers, 
illustrators, Web designers, 3D artists 
and animators, audio specialists, games 
designers — there will be plenty at 
Digital Arts World for everyone. 

The event takes place in the Main 
Hall, Olympia in London from 9-11 
October, and you'd best book your ticket 

soon. This show is the successor to our 
popular Computer Arts LIVE show 
which we've successfully staged for 
the last three years, and this year 
incorporates Digital Media World. 
In addition, within Digital Arts 
World, we're hosting the 3D 
Festival and London Effects and 
Animation Festival (LEAF), 
which have been 
combined into one 
enormous 3D 
conference with 
presenters from 
the best 3D 


iH 


David Carson is the closest thing the graphic 
design world has to a hero. Hear him speak at 
Digital Arts World. 


§2 | 3D on the 


Don't miss the biggest creative event 
to hit the UK this year... 


houses in the world. The event has the 
backing of Adobe, and a whole series of 
software and hardware companies. 

Enter the Digital Arts World show 
and you'll find the Exhibition floor 
divided into villages for each of the key 
fields of digital creativity. There will be 
areas on Graphic Design, Web Design, 
3D, Digital Video and Digital Audio. 
Within the first three villages on that 
list, we'll have stages where you'll be 
able to see the most interesting 
individuals in the industry discussing 
their latest projects, sharing insights 
on their creativity and giving tips and 
advice on both the software and the 
techniques they use. Plus, workstation 
areas will be set up where visitors can 
take hands-on sessions using image 
manipulation, illustration, video, audio, 
3D software and more. 


Graphic design village 


Everyone interested in graphic design 
and the range of topics covered in 
Computer Arts Special will be fighting 
for seats at the Computer Arts Stage. 
Each day of the event, the world- 
renowned designer David Carson will 
be opening the show with a keynote 
address. On 9 October he'll kick off the 
day by discussing the state of print 
design and magazines. The following 
day you'll hear him speak on the topic 
of The End of Print, and on Friday 11 
October he'll do a special session for 
those new to the industry. David 
Carson's credits include the influential 
Raygun magazine (among others), film 
and TV work, books, and even art 
direction for Quicksilver Clothing — do 
not miss this rare opportunity to hear 
him live in the UK. 

The Web design and Flash guru 
Hillman Curtis is flying over from the 
US, too. He'll be speaking on the 
Computer Arts Stage on 9 and 11 
October. In his first session, Hillman 
will talk about the sources of his 
inspiration and how they’re manifest in 
his work, and on the 11th he'll hold a 
freestyle Q&A session. 

Attik is one of the UK’s great success 
stories in design and illustration, and 
the company, which originated in 
Huddersfield 12 years ago with just 


FLASH deCONSTRUCTION 
Clients'New Riders Press 


For several years, Juxt has 


been a leader in the 


Ogee 
@Geeeuea 


a 


interactive design field, 
producing innovative work, 
speaking at industry 
conferences and co 
authoring books on the 
subject. FLASH 


Underworld 
Client: Junt Interactive 


} NEWS { company | { DESKTOP } CONtAct 


The creative director of Juxt Interactive, Todd Purgason, is attending the event and will be speaking 
about Flash techniques and interactivity. 


£1000 and an Apple Mac, issendingtwo | 
top creatives: Simon Morrison, London's 
Design Director and Steve Wills, 
Huddersfield’s Creative Director. Their 
talk will look at ideas, inspiration and 
the increasing importance of creativity 
in today’s communication, with the 
inside story on Attik’s NoiseFour project, 
which pulled together work from its five 
offices around the world. 

Another fascinating speaker is Dave 
McKean, who is known around the 
world for his atmospheric digital 
artwork. From a background in 
Photoshop, he has now moved on into 


3D graphics and animation. 

Anyone looking fora job in the 
creative industry would do well to catch 
Lawrence Zeegen's talk during the 
afternoon of Friday 11 October. 
Lawrence created Computer Arts’ pop 
art cover last month, and he'll be 
discussing the perfect CV and 
portfolio, and looking at how designers 
should present themselves when 
applying for jobs or pitching for work. | 

To round things off, there are panel | 
discussions on each day, covering | 
Going Freelance, Typography and the | 
state of Design Training. 


Each day of the event, David 
Carson will be opening the show 
with a keynote address... 


Ticket prices and information 


@ Three-day pass to 3D @ Three-day pass to Digital @ One-day pass to Digital 


Festival/LEAF Conference Arts World exhibition and 


Arts World exhibition and 
(includes entry to DAW stages: £18 in advance, 


£24 on the day. 


stages: £12 in advance, 
exhibition and evening £16 on the door. 


activities); £350. 


Digital Arts World | 9-11 October 2002 | Olympia, London | For tickets and further info visit: 


www.digitalartsworld.co.uk 


Or call: 


0870 429 4598 


With Adobe as the event's main 
sponsor, the software giant will have a 
big presence on the exhibition floor. 
Adobe will be holding workshops and 
demonstrations of creative techniques 
with packages like Photoshop and 
Illustrator, InDesign, Premiere, 
LiveMotion, After Effects and 
GoLive — all within one of our 
workstation areas. Don't miss this 
chance to take a training session 
in the software you use. 


New media design 


Cre@teOnline magazine will 
offer no less on its stage. 
Hillman Curtis will appear there 
on Thursday 11 October with a 
talk entitled MTIV: Further 
Discussions on New Media 
Design. This covers his 
seven-step process for 
design in new media, with 
reference to recent works. 
Craig Swann, the 
founder of CRASHIMEDIA 
is flying in from Toronto, 
and will be talking about 
one of his key areas of 
expertise — Web 
audio. Plus, 
the creative 
directors and 
founders of 


@ Student Day (Friday, 11 


October): £8 in advance, 
£12 on site 
- Group concessions are 


also available 


Hi-ReS! Florian Schmitt and 
Alexandra Jugovic, join us on stage to 
give a talk called Inspiration and 
Motivation in New Media. They'll look 
at some of their recent works, and 
discuss their fascination with 
interactivity, Flash and Shockwave. Ideas 
are what it’s all about for this company, 
and with sites like Diesel and The 
Beatles under its belt, this talk should 
prove to be an eye-opener. 

Flash experts Brendan Dawes 
and Todd Purgason, of Magnetic 
North and Juxt respectively, will 

both be offering their unique 
views on online design and 
interactivity, too. Brendan 
Dawes has planned a 
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BOUNDAR- 


An entire half-day session will be devoted to ILM’s amazing work on Star Wars Episode II: Attack of the Clones. 


Simon Morrison and Steve Wills will be at Digital Arts World, talking about how their company, 
Attik, has broken boundaries in modern graphic design. 


talk called Learning To Look Up, where 
he proposes that interactive design is 
not just about what happens onscreen. 
Todd Purgason, meanwhile, is flying in 
from the US to dotwo afternoon 
sessions on 9 and 11 October. The first 
covers Juxt’s design and branding 
strategies, while the second deals 
with his personal and professional 
exploration of interactive metaphors. 
Jobs and training are important 
items on the agenda at Digital Arts 
World, and the show will have a 
dedicated Career Advice Centre, where 
recruitment companies will present 
opportunities to digital artists, 
including OPM Response, a specialist 
in recruiting for new media. Then there's 


the Training Centre, where you'll find 
Ravensbourne College and The 
Glasgow School of Arts. Both will 

be explaining the various training 
options they offer. 


3D Festival/ LEAF Conference 


As a pro-level conference, this section 
of the event costs more to attend, but 
even if you only see a fraction of the big 
names on its awesome roster, it'll be 
well worth it. 

An entire half-day session is being 
devoted to Industrial Light and Magic’s 
effects work for Star Wars Episode II: 
Attack of the Clones. Find out how ILM 
designed a cast of digital characters, 
animated and rendered them, and how 
they integrated into the scenes with live 
actors who also, incidentally, starred in 
the film. Multi-layered clothing, skin 
with underlying musculoskeletal 
structures and rigid body motion will 
all be discussed by a team of ILM 3D 
experts. Not to be missed. 

Anthony LaMolinara and Scott 
Stokdyk of Sony Pictures Imageworks 
will talk about their work on Spider- 
Man, and The Moving Picture Company 
will reveal some of its tricks and 
techniques in creating the visual 
effects for Harry Potter. Mike McGee 
of FrameStore-CFC is to discuss the 
creation of the fantasy world in 
Dinotopia , and Jason Schleifer of 
WETA Digital is flying from New 
Zealand to demystify some of his 
company’s effects work in The Lord 
of the Rings. 

But these sessions on big motion 
pictures are just the beginning. Web3D, 
effects for commercials, and crucial 
industry topics such as rights 
management and market trends are 
also on the agenda. Other companies 
involved include Electronic Arts, 
Codemasters, Passion Pictures, Jim 
Henson's Creature Shop and more. 


3D World on stage 


On the 3D World stage, accessible to 
all DAW attendees, you can see talks 
by The Moving Picture Company and 
Stormfront Digital Pictures, while 

new media company Sprite Interactive 
will present on creating character 
animation in Poser and exporting it for 
use in Websites, mobile campaigns, 
handheld apps and on television. 

We have several sessions on creating 
game graphics, and a panel discussion 
asking which is the best area of 3D 

to be working in: movies, games or 
television? Working with our sister 
magazine, Edge, we'll be presenting 
three sessions on designing game 


DBAworld 


sponsored by... 


Get all the advice you'll ever need on how to present your CV and portfolio 
from the accomplished illustrator and designer Lawrence Zeegen. 


v 


graphics, plus a panel discussion on 
how to get into the games industry. 

The 3D Village is sponsored 
by Maxon, and the company will 
be showing the brand new version of its 
Cinema 4D software. Plus, there will be 
a 3D workstation area in which you can 
take training sessions in software such 
as Cinema 4D, Alias|Wavefront Maya, 
Discreet 3ds max and Softimage/XSI. 
Curious Labs will be exhibiting, giving 
you the chance to see Poser 5, first- 
hand. NXN Software — known for its 
workflow and interactive design 
systems — is also to exhibit its Alien 
Brain software. 

The Digital Video Village rounds 
everything off nicely. Pinnacle Systems 
is sponsoring the area and will be 
demonstrating how to use its desktop 
and high-end systems for capture, 
editing, titling, effects and output. 

There will be a digital video studio 
up and running, and visitors will have 
the chance to edit video clips and add 
effects, with professional instruction, 
each day of the show, using Pinnacle, 
Apple and Adobe products. With 
LaCie and its FireWire 
peripherals; Matrox, the 
specialist in real-time editing and 
effects; and Xenturi, which offers 
systems for adding interactivity to 
video and multimedia authoring 
services, this village is an invaluable 
learning environment. 

Finally, in our Digital Audio Village, 
you ll find a studio area with pro 
instructors teaching sound technique, 
using Apple audio products. 

Watch the show Website for more 
info about every section of this massive 
event. See you there. FEES 
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FRIDAY 11 OCTOBER 


(STUDENT DAY) 
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_E THURSDAY 10 OCTOBER L. WEDNESDAY 9 OCTOBER 


3D WORLD 


10:15 >> MAXON 


Check the Website soon for further details on this slot. 


11:15 >> PANEL DISCUSSION: 

TV, MOVIES OR GAMES? 

What's the hottest area of 3D to be working in today? 
Top experts from three key industry areas battle it out. 


Weiieg80 FOR COMPUTER 


Our sister magazine, Edge, will be inviting a speaker to 
discuss the creation of 3D models and animation for 
use in cutting-edge computer gaming. 


13:15 >> TECHIMAGE 


Check the Website soon for further details on this slot. 


GiGRMPRON DE Or 


Big effects, tiny teams: a talk about the business of 
setting up on your own as a 3D animator and the art of 
producing high-quality work for special venues, large 
format and beyond! 


15:15 >> ALIAS|WAVEFRONT 


Check the Website soon for further details on this slot. 


16:15 >> DIGITAL MUSIC / AUDIO 
Our sister magazines Computer Music and Future Music 
will be inviting a digital audio expert onto the stage to 
talk about their current creative techniques. 


10:15 >> DISCREET 


Check the Website soon for further details on this slot. 


BigtAP NUE AND AUDIO 


Our sister magazines Computer Music and Future Music 
host a discussion covering the latest trends in making 
music on desktop computers, professionally. 


12:15 >> DIGITAL MUSIC/AUDIO 


Computer Music and Future Music invite a digital audio 
expert onto the stage to talk about creative techniques. 


13:15 >> ALIAS|WAVEFRONT 


Check the Website soon for further details on this slot. 
:15 >> 3D FOR COMPUTER 
Rive 33 FOR COMPU 


Oursister magazine, Edge, invites a speaker to discuss 
3D models and animation for cutting-edge games. 


15:15 >> MAXON 


Check the Website soon for further details on this slot. 
6:15 >> MOVING PICTURE 
CoiPany 


Ben Shepherd, CG Supervisor, and Jim Radford, head 
of 3D, present MPC’s work on Weather, a four-part 
series for BBCI. Find out how the company created 
graphics to cover the whole spectrum of weather. 


10:15 >> ALIAS|WAVEFRONT 


Check the Website soon for further details on this slot. 


11:15 >> PANEL DISCUSSION: ow 
TO GET INTO GAMES DEVELOPMENT 


Learn how established games professionals got started. 


Bi a RES RACTIVE ON 


This new media agency shares its tips on creating 
character animation in Poser, exporting them in Flash, 
and using them in new media projects including PDAs, 
mobile phones, television and Websites. 


13:15 >> MAXON 


Check the Website soon for further details on this slot. 


12:15 >> DIGITAL MUSIC / AUDIO 


Our sister magazines Computer Music and Future Music 
invite a digital audio expert onto the stage to talk about 
creative techniques. 


15:15 >> DISCREET 


Check the Website soon for further details on this slot. 
4:15 >> RCOMPUTER 
i ASK 480 FOR COMPUTE 


Oursister magazine, Edge, will be inviting a speaker to 
discuss the creation of 3D models and animation for 
use in cutting-edge computer gaming. 


* Details subject to change 


COMPISTER 


10.15 >> DAVID CARSON 


Keynote address: magazine design. 
David Carson talks about the state of page layout today. 


11:15 >> ADOBE 


Our main show sponsor will be inviting a high-profile 
user of its software to talk about inspiration & workflow. 


12:15 >> HILLMAN CURTIS - 
SENDING ON SOMEONE'S 
SHOULDERS 


A personal journey through inspirational designers, 
artists, writers, and film-makers, past and present who 
have inspired Hillman’s work. 


13:15 >> APPLE 


Special sessions in digital audio and digital video. 


Goinic FANTANGE SION’ 


Learn from the experiences of top-name designers, 
illustrators and 3D artists who have gone freelance. 


15:15 >> TBC 


Check the Website soon for further details on this slot. 


16:15 >> MIKE UDEN OF RUSHES 


Mike Uden reveals the secrets behind Rushes’ TV ads. 


17:15 >> PRIZE DRAW 


Daily prize draws at the Future Publishing magazine stand. 


10:15 >> DAVID CARSON 
Keynote address - The end of print. 
ls print design dead? Is new media holding the knife? 


11:15 >> ADOBE 


Anentertaining Photoshop tips session from Adobe. 


12:15 >> ATTIK 


Simon Morrison, London's Design Director and Steve 
Wills, Huddersfield’s Creative Director, will be speaking 
about inspiration, creativity and NoiseFour. 


13:15 >> TBC 


Check the Website soon for further details on this slot. 


14:15 >> PANEL DISCUSSION: 
- TOO MANY FONTS, NOT 


TYPE 
ENOUGH LEGIBILITY? 


Font designers and typographers discuss the problems 
posed by the plethora of fonts out there... 


15:15 >> APPLE 


Apple's presentation on creativity in video & audio apps. 


16:15 >> DAVE MCKEAN 


By popular demand, legendary digital artist Dave 
McKean will share his techniques and inspiration. 


17:15 >> PRIZE DRAW 


Daily prize draws at the Future Publishing magazine stand. 


10:15 >> DAVID CARSON 

Keynote address: Approaching design afresh. 

David Carson's personal advice to young designers and 
artists who are just entering the creative industry. 


11:15 >> ADOBE 
Network publishing is the way forward. Find out why it's 
important to designers at Digital Arts World. 


12:15 >> HILLMAN CURTIS 
Don't miss this presentation, where Hillman holds an 
open Q&A session with the audience. Fire away! 


13:15 >> APPLE 


Check the Website soon for further details on this slot. 


14:15 >> PANEL DISCUSSION: THE 
STAGE OF DESIGN TRAINING 

Are universities and colleges equipping students for the 
industry? Top recruiters and training pros argue it out. 


15:15 >> TBC 


Check the Website soon for further details on this slot. 


16:15 >> LAWRENCE ZEEGEN: Cvs, 
PORTFOLIOS AND INTERVIEW 
TECHNIQUES 

This pro illustrator also leads the design courses at 
Brighton Uni. If you're about to enter the industry or go 
for a new job, this talk will be indispensable. 


10:15 >> TBC 


Check the Website soon for further details on this slot. 


11:15 >> HI-RES! 

Alexandra Jugovic and Florian Schmidt present a talk 
called Inspiration and Motivation in New Media, with 
special reference to this company’s recent online work. 


12:15 >> ADOBE 


Catch presentations on Adobe's online tools such as 
LiveMotion and GoLive. 


13:15 >> PANEL DISCUSSION: 
WEB 3D 


Willit ever take off? Are packages like plasma and Swift 
3Da waste of time for the serious Web designer, or will 
they open up an exciting new world of 3D on the Web? 
Join us for an in-depth discussion on the merits of 
getting into Web 3D. 


14:15 >> 3COM 


Check the Website soon for further details on this slot. 


15:15 >> TODD PURGASON 
The Creative Director of Juxt Interactive speaks live 
about online branding. 


16:15 >> CRAIG SWANN 

Flying in all the way from Canada, this four-time 
Shockwave Site of the Day winner will be talking about 
the oft-overlooked aspect of online design, Web audio. 


10:15 >> TBC 


Check the Website soon for further details on this slot. 


11:15 >> BRENDAN DAWES 
This Flash guru will be speaking on Learning To Look Up: 
interactive design isrit just about what happens onscreen. 


12:15 >> ADOBE 


Presentations on Adobe's online tools, 


BOEAGORATION IV NEW MeDia 


More and designers are setting up on their own and 
working on collaborative projects with other designers. 
Is this the end of the Web design agency as we know it? 


14:15 >> 3COM 


Check the Website soon for further details on this slot. 


15:15 >> HILLMAN CURTIS 

Hillman will talk about his recent book release, MTIV: 
further discussions on New Media Design, and his 
seven-step process for designing new media, expanded 
to reflect new projects and the new lessons learned. 


18:15 == ORANGE MULTIMEDIA 


Jonathan Jowitt and Lizzie McKie of Orange Multimedia 
Operations (formerly Ananova Ltd.) talk about 
opportunities provided by new mobile technology. 


10:15 >> TBC 


Check the Website soon for further details on this slot. 


11:15 >> TBC 


Check the Website soon for further details on this slot. 


12:15 >> ADOBE 


Catch presentations on Adobe's online tools. 


& 15 >> PANEL DISCUSSION: 
ETTING AND KEEPING CLIENTS 

ps eh? Can't work with them, and there's no work 

without ‘em. But there's a definite knack to coping with 

their demands. Find out how the big agencies deal with 

their clients, and join us for our round-table discussion 

on keeping on the right side of your clients. 


14:15 >> 3COM 


Check the Website soon for further details on this slot. 


15:15 >> TODD PURGASON 
The Creative Director of Juxt Interactive speaks live. 
Don't miss it. Topic to be announced soon. 


16:15 >> BD4D 

By Designers For Designers holds regular creative 
events for the design community. Ryan Carson and Ryan 
Shelton will discuss their observations on the global 
design community, and guiding it to a healthy future. 
See some amazing work... 


CRE@TEONLINE 


Web designer Hillman Curtis is 
speaking from both the Computer 
Arts and Cre@teOnline stages each 
day of the show. Find out who has 
inspired him and how his seven-step 
design process works. 


3D FESTIVAL/LEAF SCHEDULE 


COME 
MIRE MING & DAVE THROSSELL 


9:00 >> Scott Stokdyk, Visual Effects Supervisor at 
Sony Pictures Imageworks on Spider-Man. 


9,45 >> mit Fitms Gabriet White on Black Hawk Down. 


10.30 >> coffee. 


11.00 >> pigitat Domain: Photorealistic effects for Ads. 


"1 A5 >> Framestore-CFC’s Mike McGee on creating 
a fantasy world for Dinotopia. 


12 45 >> Keynote: lain McCaig, conceptual artist and 
director: It's all about inspiration. 


14.00 >> kyle Odermatt, CG Lead, The Walt Disney 
Company: Graphics on the hybrid film, Treasure Planet. 


14.45 >> the Moving Picture Company's Peter 
Myyzers and Greg Salter on Harry Potter’s visual effects. 


15.46 >> Coffee. 


16.15 >> say Redd, Visual Effects Supervisor, Sony 
Pictures Imageworks: The making of Stuart Little 2. 


17.00 >> Special Session: Challenges forthe next 
decade! With Disney, FrameStore, MillTv and more... 


MODERATOR: SHELLEY PAGE 
9.00 >> Industrial Light & Magic on Men in Black Il. 


9.45 >> Andrew Ruhemann, CEO, Passion Pictures: 
Gorillaz at the Brit Awards, 


10.30 >> Coffee. 


"1 .00 >>Marcus Manninen, Head of 3D Commercials 
at Framestore-CFC on high-end 3D commercials. 


11.45 >> DreamWorks/PDI (content TBC). 


12.45 >> Keynote - Anthony LaMolinara, Animation 
Director, Sony Pictures Imageworks: The Future of 
Computer Graphics. 


18:45 >> Pierre Coffin, MacGuff/Passion Pictures 
Cana commercial director have a soul when twenty 
people decide for him what to do? 


14.30 >> matt Aitken, Lead Modeler at Weta Digital 
onthe visual effects for The Lord of the Rings 


16.15 >> Special Session - Andrew Ruhemann and 


Pierre Coffin: The French Revolution, with two visual 
effects gurus from France. 


MODERATOR: KEN MCGORRY 


9.00 >> Industrial Light & Magic’s Ben Snow kicks off 
a morning devoted to Star Wars... 


9.45 >> Geott Cambell from the USA leg of Industrial 
Light & Magic on Star Wars. 


10.30 >> coffee. 


"1 .00 >> More Star Wars secrets from Industrial Light 
& Magic’s James Tooley. 


nN 45 >> Industrial Light and Magic — Star Wars 


12.45 >> Keynote: Star Wars 
Ben Snow, Industrial Light & Magic. 


14.00 >> Oscar Grillo on the importance of 
storytelling in media. 


14.45 >> vir-the Hive: naturalism in 3D 
with Dave Childs, Head of 3D and Steve Moncur, 
Senior Animator. 


15.30 >> Hector Macleod, Managing Director of 
Glassworks talks about the Sprite commercial. 


COBRA 


MODERATOR: SHELLEY PAGE 


9.00 >> wittByles, Head of CG, Soho601 
The new role of a CG producer. 


9.45 >> Aardman on stylised animation. 


10.30 >> Coffee. 


11.00 > Jason Schleifer, Creature Technical Director, 
Weta Digital on Lord of the Rings. 


11.45 >> sean Feeney, Head of CGI, Jim Hensonis 
Creature Shop talks about production nightmares. 


12.30 >> Lunch. 


14.00 >> Colony’s Mario Cavalli talks about 
unfriendly software. 


14.45 >> Special Session: Gearing up for production 
With Soho601, Henson's Creature Shop and FrameStore. 


15.45 >> cotfee. 


16.15 >> dan Platt, Solid Image Arts 
The art of freelance survival. 


17.00 >> Frank Petzold, Visual Effect Supervisor, 
Tippett Studio Carl & Ray Pet Shop — Blockbuster ads. 


CORSERERCE 


MODERATOR: SAM COATES 


9.00 >> Pauttopotos, Factor: Artdirecting and 
texturing a licensed property in Star Wars. 


9.45 >> sam Coates at Sony Computer Entertainment 
on the consequences of cinematic ambition. 


10.30 >> Coffee. 


11 00 >> Thomas Jacobsen from IO interactive: The 
challenges of porting PC game engines to consoles. 


11.45 >> Building a 3D engine from scratch: 
»R&D Programmers Alex Evans and Rune Vendler tell all. 


12.30 >> Lunch. 


14.00 >> Dan Piatt, Solid image Arts 
From vampires to beauties: digital character creation. 


14.45 >> Harry Potter — From book to film to game, 
with John Miles and Frank Kitson from Electronic Arts. 


15.45 >> coffee. 


16.15 >> Russ Sabin, Art Director, Sony Online 
Entertainment on game art and techniques forthe future. 


17.00 >> Special Session: The Next Generation of 
Games, with Immaginare and Electronic Arts. 


KARP ERAE ARRAN MORRIS 


9.00 >> Paul Topolos on pre-visualisation. 


9.45 >> Isaac Kerlow, The Walt Disney Company on 
digital production workflows of the future. 


10.30 >> Coffee. 


11.00 >> PautFranktin, Head of 3D at Double 
Negative, UK, on the visual effects on Below. 


"1 45 >> Cinesite’s Steve Street and Jeremy Hall talk 
about the importance of R&D in visual effects. 


12.30 >> Lunch. 


14.00 >> Special Session: The role of VFX in scene 
narrative, with speakers including Alan Marques, Isaac 
Kerlow of Disney, Alex Morris at Hayes-Davidson and 
Paul Franklin of Double Negative. 


14.45 >> Task-based crowd replication — a talk by 
Dave Throssell, Jordi Bares and Adrian Wyer of MillTv. 


15.30 >> steve May, Simulation and Effects 
Supervisor, Pixar, on furcreation in Monsters Inc. 


MODERATOR: DAN SARTO 


9.00 >> Creating Striking Graphics for MutaFukaz. 
Guillaume Renard and Yann Blary of EAMcHmAn. 


9.45 >> Ross Cunningham, Interactive Design 
Manager at Smoothe Interactive on 3D techniques for 
photoreal Web graphics. 


10:30 >> cottee. 


11 .00 >> David Hodge, Executive Producer at Pesky 
Pictures discusses storytelling on the Web in The 
Amazing Adrenalini Brothers, winner of the Netsurfers 
Award at Annecy Festival. 


11.45 >> Bermuda Shorts’ Martyn Pick outlines his 
painterly approach to animation, covering 3D, hand 
animation and digital technology — fine art meets 
digital technology... 


12.30 >> Lunch. 


14.00 >> Enhancing stop motion animation for large- 
format cinema: Cosgrove Hall Films’ Steve Maher and 
Chris Bowden discuss the use of digital tools. 


14.45 >> Masterclass on creating digital characters 
for Spider-Man, by Anthony LaMolinara, Animation 
Director at Sony Pictures Imageworks, USA. 


MODERATORS: BEN WHARTON 


9.00 >> sebastian Belcher, Harbottle and Lewis talk 
about business-critical legal aspects relating to console 
game development, 


9.45 >> Structures of Destruction: three interactive 
plot structures. 


10.30 >> cotfee. 


11.00 >> Guy Wilday, Head of Studio, Codemasters 
on designing graphics for Colin McRae Ill. 


11 45 >> Film to game conversions: discussed by 
Andrew Oliver, Philip Oliver and Jonathan Evans of 
Blitz Games. 


12.30 >> Lunch. 


14.00 >> mark Washbrook, Head of London Studio, 
Kuju Interactive discusses narrative and interactivity in 
Reign of Fire. 


14.45 >> mick Morris from Audiomotion on motion 
capture for animators, 3D artists and gamers. 


15.30 >> drew Angeloff, Tools and Middleware 
Manager at Microsoft Xbox on using middleware to 
facilitate console games creation. 


MODERATORS: TIGA 
9.00 >> Key findings from the US Trade Mission. 


9.45 >> Market trends - special focus onthe US 
and Europe. 


10.30 >> cottee. 


11.00 >> Inhibitors and activators inthe 
US/European market. 


11.45 >> Key market issues. 
12.30 >> uunch. 
14.00 >> New business models. 


14.45 >> Looking to the future: J2EE, G3 and 
high-bandwith gameplay. 


18.30 >> 1615 Free. 


9, 00 >> Willms Buhse from Digital World Services on 
the future of digital music. 


9.45 >> John Eacott from InformaLorg talks about 
encoding and performing. 


10.30 >> cottee. 


11.00 >> Rist Brouwer, CEO and Founder of DMD 
Secure on music rights management forthe Web. 


N A5 >> Lewis Sykes on iRiealism: a digital 
music project. 


12.30 >> Lunch. 


14.00 >> Panel discussion: The future of VI-ing. 
Graham Daniels of Addictive TV, Giles Thacker and more. 


14.45 >> Masterclass: Houdini for first-time users 
Inassociation with Techimage. 


15.45 >> cottee. 


16.15 »> Masterclass: Advanced Renderman 
Inassociation with Techimage. 


17.00 >> Gregor von Scheidt, CEO of NXN Software 
talks about production management and asset 
management techniques. 

HEN 


racers CIALIST + 


9.00 >> Bronac Ferran, Head of Collaborative Arts, 
The Arts Council shares his expertise on advances 

in technology and the implications for the creative 
arts industry. 


9.45 >> Greg Roach, CEO and Founder at Hyperbole 
Studios talks about virtual cinema. 


10.30 >> Coffee. 


11 .00>> Bruce Steele, Head of Special Projects at 
Glassworks Post Production on ‘Real-time fun and games 
at Glassworks’. 


11.45 > Andy King at BBC Resources demystifies a 
hazy issue: High Definition — what is it? 


12.30 >> tunch. 


14.00> Mark Stephen Meadows from Parallax on 
foreshadowing, foreshortening and interactive narrative. 


14.45 >> independent Animator Larry Lauria hosts a 
masterclass in character animation for animators and 
games developers. 


SUE SC RV SROM IER 


9.00 >> Emma Westecott, Head of Studio at 
The Interactive Institute, Sweden on the future of 
digital content. 


9.45 >> 3D for stereoscopic films — a talk by 
Phil Streather of the VP EMEA Large-Format 
Cinema Association. 


10.30 >> cottee 


1 .00 >> Interactive TV - a Contemporary Case Study 
by Mike Severyn, Managing Director at TsiTX. 


11.4.5 >> Andy White from The Picture Exchange on 
creative networking in post-production and animation. 


12.30 >> Lunch 


14:00 >> Masterclass: How to get ahead in the 
Animation, Effects and Games Industry, 

Moderated by Shelley Page, Dreamworks, with Paul 
Howell, Creative Director, BBC MediaArc; Patrick 
Kenney, Senior Staffing Manager, Electronic Arts; Jeremy 
Hall, Cinesite; and Helen Brunsdon, Aardman. 
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;3 O tips for getting 
’ started in Web 3D 


L 


Ray 
‘er Oren 
i 


We have 30 great hints and tips to unravelling the 


complexities of Web 3D... 


eb 3Dis still in its infancy. Like other 
4 streaming media formats such as 
: Flash, QuickTime and Shockwave, it 
\ still has to settle down and one or 
two 3D formats have to rise to the top of the pile 
to become the standard. 

As it stands, a designer has a number of 
different 3D formats to choose from depending 
onthe kind of audience the Website is aimed at. 
Some formats, such as the increasingly popular 
Shockwave 3D and Viewpoint, require the use of 


a player or plug-in that the site visitor must 
download (if they haven't already got it installed) 
before any 3D content can be viewed. Other 
formats eschew the use of a player and use Java 
instead. As long as Java is enabled in their 
browser, the 3D content should be immediately 
visible. With all that in mind we've assembled 
some tips to get you started. 


True Web 3D can be 
] complex. The new Web 

3D formats offer a lot 
more than those like VRML of 
old. More detail, better texture, 
dynamics even. First things first: 
decide what you want to achieve 
and how much interactivity is 
really necessary. An animated 
gif of your 3D object may be all 
that is really required and will 
save all the associated 
headaches of download time 
and viewer compatibility. 


Maya Shockwave 


Exporter 


There are many 

different Web 3D 

formats vying forthe 
top spot as the Internet's 
preferred 3D content delivery 
system. Each is targeted at 
slightly different markets and 
offers different abilities. You'd 
do well to investigate all the 
options before diving in blind 
and using the first one that takes 
your fancy. However, if you're 
only interested in a system for 
your current 3D application, 
your choices may be limited. 
Some 3D formats require the 
use of a special application 
that takes your 3D models and 
adds interactivity and publishes 
them in their Web 3D format. The 
bottom line is that you'll need to 
spend extra money on some 
Web 3D systems. 


Viewpoint VET and 

Shockwave 3D are 

two of the top 
contenders for 3D Web content, 
but they offer different kinds of 
solutions in terms of workflow. 
Viewpoint is aiming at the 
marketing and promotions use 
of Web 3D while Shockwave 
looks, at least on the surface, to 
be more suitable for creatives. 


Textures 


If you decide to go 
L the Shockwave 3D 

route, you will also 
need Macromedia Director 8.5 
because Shockwave 3D .w3d 
files that are output from a 3D 
program cannot be published on 
the Web. Director is used to add 
interactivity using the 
Shockwave .w3d files and 
outputs the final Shockwave 
player-ready content. Director is 
not an easy package to grasp 
although recently it has become 
better in this respect. 


Maya Shockwave 


As mentioned elsewhere on these pages, textures 
are a big asset because they can convey a lot more 
detail than geometry alone. Different 3D formats 
may handle texture differently, and in some cases 
geometry may be more efficient. However, you need 
to pay attention to details when using textures, 
because a badly created texture will take up the 
same bandwidth as a good one. If realism is 
important — for example, in an online environment — 
pay attention to things like dirt and grime and how 


they accumulate in nooks and crannies. 


Despite concerns about keeping file sizes low, you can still get 
fairly complex models up on the Web. This car is pushing the 
performance limit of common computer systems. 


G . If you want to produce 
interactive 3D Web 
content with the 

maximum compatibility for 

users, a Java-based Web 3D 
solution might be a better 
option. Kaon makes a program 
called Activate!3D Author which 
can import 3D models in 

popular formats (such as 3DS) 

and publish interactive Java- 

based Web 3D content. No 
player is required by site visitors 
in order to view the content, but 

Java must be enabled ina 

compatible browser. Visit Kaon 

at [w] www.kaon.com 


There are a number of 

applications that can 

output publishable 
3D models directly. Amapiis 
one, but it uses the relatively 
obscure 3Space ZAP format and 
requires the ZAP player for 
viewing content. On the plus 
side, the Amapi system has a 
built-in dynamics system called 
3Space, and it’s pretty easy to 
use too. The downside is that 
Amapican be pretty unstable. 


Viewpoint’s VET 

format (Viewpoint 

Experience 
Technology) is supported by 
many 3D programs including 
Cinema 4D XL (via the 
commercial Bola plug-in), 
Carrara 2, Poser Pro Pack and 
TrueSpace. Plug-ins for 
Viewpoint export are available 
for Maya, 3ds max and 
Lightwave and are freely 
available from Viewpoint's 
Website. Bola can export 
VET-embedded HTML files; the 
others export Viewpoint files 
that will need to be assembled 
into a Web page using 
applications from Viewpoint. 


cable connection. 


Don't forget good old 

VRML. VRML 

(Virtual Reality 
Markup Language) is supported 
by most 3D programs so you can 
export VRML format 3D models 
directly from your favourite app. 
However, it's an old format that 
has lost favour in recent years 
since it did non-streaming. 


Creating 3D content 

with Shockwave 3D 

requires a big 
investment in time and effort as 
well as money. Shockwave 3D 
does seem to be the most 
flexible for adding 3D 
interactivity thanks to Director, 
but you've got the added costs of 
the software and a steep 
learning curve to consider. 


Exporter 


Environments like this are quite good fun but can be bandwidth 
hogs. This Shockwave environment took 1:12s to download ona 


Other Web 3D 

authoring apps 

include AXEL 
([w] www.mindavenue.com) and 
RealVIZ's SceneWe@ ver. 
SceneWe@ ver is designed for 
creating online interactive 3D 
panoramas with limited 
interactivity. AXEL looks like a 
very good Web 3D package and 
it’s particularly well suited to 
creative Web 3D work. > 
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@, MostWeb3D 
% syst 
@ systems use 

¢ polygons for their 


3D data. Bear this in mind when 
modelling for the Web. There's 
not much point building a model 
using a 3D app that supports 
only NURBS, spline patches or 
solid geometry (for example, 
Electriclmage modeller) as you 
will usually have a lot less 
control over the conversion to 
polygons when the model is 
exported. For Web 3D as with 
game design, you really need to 
be able to construct polygon 
meshes directly. 


Polygon modelling is ideal for creating Web 3D content since this 
is the geometry type favoured by the Web 3D systems. 


% As with geometry, 
<4 keep textures 
®  smalland 


efficient. Take into account how 
large the object will be in the 
Web page and base your texture 
sizes on that. Some Web 3D 
authoring solutions may help to 
optimise textures for you. 
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@, 'fyouhave 

% a pol 

s polygon 

® modeller, use it. 


Models for the Web built using 
polygons offer you the most 
flexibility during the creation 
process because that’s how they 
will be delivered online. 


% Web 3D formats 
like Shockwave 
© and Viewpoint 


do, of course, offer animation as 
well. Animation can help to 
make up for lack of detailina 
model where appropriate. It can 
also help make less interesting 
models more compelling. 


@, Modelling for 
° the Web is much 
© like games 


modelling. Since bandwidth is 
limited, geometry is ata 
premium; so light, efficient 
models are the name of the 
game. However, you'd be 
surprised at how complex you 
can go before a model becomes 
impractical to publish. 


Model efficiently 


Low resolution modelling is an art in itself and while 
Web 3D modelling has a lot in common with game 
design, polygon counts are not necessarily always as 
stringent. However, efficiency is the name of the 
game so you'd do well to look at game design for good 
examples of efficient modelling. One of the best low- 
res modellers is Bay Raitt who uses the high end 
package Mirai to create low-res but highly interesting 
3D models. Check out [w] http://cube.phlatt.net/ 
home/spiraloid and [w] www.izware.com/mirai/ 


gallery/index.html for examples of his work. 


% To make things 
Sa interesting, 
$ * . 
animation can be 


triggered interactively. For 
example, a CD player's drawer 
can open if you click on a button 
onits front panel, or rotating the 
view animates the different parts 
of an object to show how they all 
fit together. This is particularly 
useful when Web 3D is used for 
marketing and promotional 
purposes or for online product 
demonstrations. 


% If you’re not too 
4 good at low-res 
© modelling oryou 


already have models made that 
you want to use on the Web, try 
modelling the best you can and 
then running the model through 
a polygon reduction filter (if your 
app has it). It may not be ideal 
but will usually help to give 
some idea of just how light you 
can go while still retaining 
detail. You can then use the 
reduced modelLas a guide or edit 
it directly to res-up some areas 
and clean up the inevitable 
dodgy geometry that a lot of poly 
reduction tools often produce. 


@, |f 3D interactivity 
% , ; 
¢? isnot crucial, you 
© could try using 


Flash instead. A 3D program 
such as Amorphium Pro can 
actually render directly to Flash 
format allowing you to create 
decent size animations of your 
3D models efficiently. The plus 
side is that you don't have to 
down-res the mesh so the model 
can be as smooth and detailed 
as you like. Flash offers a 
number of rendering styles 
though it’s best suited to clean 
flat colours or simple shading. 
Combined with a Flash authoring 
tool you can fake 3D pretty 
convincingly, plus it has the 
added benefit of looking a Lot 
more contemporary (and 
arguably has greater creative 
flexibility). Unfortunately, full 
geometry-based Web 3D can 
easily look clunky and frankly 
dull by comparison. 


@, Texture maps are 
° your ally. Use 
ge 
textures 


wherever possible to supply 
detail in the model. For instance, 
the controls ona TV set or 
mobile phone are so tiny there’s 
really not much point in 
modelling them. A texture 
should work well instead. 


Polyreduction filters can help especially if you need to re- 
purpose models for the Web. 


@, Sound canadd 
% ; 
> amassive 

© amount of fun 


to Web 3D and offers a great 
deal of feedback when offering 
interactivity. For example, a 
simple click sound plays when 
you push a button ona 3D 
object. Creative use of sound 
can go a long way towards 
making 3D content. 


®, Tostream ornotto 
21 4 stream. Web 3D 

© formats come in 
roughly two flavours: those that 
stream and those that don't. 
Streaming Web 3D content will 
begin to appear in the browser 
while the rest of the data is still 
in transit. Streaming 3D will help 
to reduce waiting times and 
keep users from closing the Web 
page in frustration. 


PAN 


‘OOM ROTATE 


Kaon’s Java-based Web 3D system requires no player and runs in 
any Java-aware browser. It even allows you to measure the size of 
objects with an interactive tape measure. 


©, !f you're new to 
26 ~® Web 3D and 

© wantto get an 
idea of what it’s all about, visit 
[w] www.shockwave.com. Here 
you'll find a list of entertaining 
sites with some interesting 
Shockwave 3D content 
including games such as 3 Point 
Shootout and Big Mouth Bass. 
For examples of marketing and 
promotional use of 3D try 
[w] www.viewpoint.com which 
has Links to a number of third 
party sites that already 
incorporate Viewpoint 3D. 


z 4 MEASURE RESET 
; A 
I ore +B Os al 


www.kaon.com 


It's usually the 
older formats 

* like VRML that 
do not stream. For this type of 
3D content, absolute 
size/download time is the 
biggest single factor to consider 
during creation of the 3D 
content. VRML has tended to 
be used for online games 
and environments, but here 
again streaming formats are 
usually better. 


When creating 
3D content, 

” many systems 
allow you to preview the results 
without actually publishing them 
(such as the Maya Shockwave 
3D plug-in). However, as with all 
things Web, assume the lowest 
spec system when previewing. 
Many visitors to a site may not 
have OpenGL accelerated 
graphics so test your results 
on such a system before 
publishing. Also bear in mind 
download times since there are 
plenty of users that only have 
64k modems. 


¢, Dynamics is a 

“ » way for 3D 

» graphics apps 
and viewers to simulate the laws 
of physics, such as collisions 
between objects, and imbuing 
them with properties like 
friction, gravity and mass. 
Formats like ZAP and 
Shockwave 3D support 
dynamics and are especially 
useful for online games and the 
like. Shockwave 3D uses the 
Havok physics engine, which is 
a very powerful and well 
established dynamics system. 


Online humans can take many forms in 3D Web 
graphics. From simple Avatars to game characters to 
virtual online hosts. Creating animation, be it pre- 
keyed or interactive, takes a similar amount of skill 
and attention to detail as fornon-Web-based 3D 
graphics. The animation data can be quite light in 
terms of file size so it pays to make the most of it. 
Whether creating Avatars for games or communities, it 
Pays to make the effort to create them from scratch for 
originality’s sake. Maintain your creative credibility 


and resist the urge to use Poser people at all cost. 


@, Beaware of the 
2 § » differences 

© between 
platforms. Because of the 
interactive nature of some Web 
3D systems you may need to 
make use of the keyboard to 
access alternate viewing 
features. Try to choose keys that 
are common to both Macs and 
PCs (for example, the Control- 
clicking in Internet Explorer for 
the Mac pops up a contextual 
menu in the Shockwave player 
view, which will cause conflicts 
if you have assigned this key 
combo a command). Using the 
right mouse button is also a 
definite no-no. The Spacebar 
and Shift keys are better 
candidates. 


Maya users can 
make use of 

the built-in 
dynamics system to create non- 
interactive pseudo-dynamic 
playback in a browser. Dynamics 
can be set up in Maya then 
converted or ‘baked’ into simple 
animation data for export to 
Shockwave 3D. Dynamics offers 
a lot of creative potential and 
adds a great deal of realism to 
3D Web content, as it does 

any kind of 3D animation. It 

may be possible to fake 
interactive dynamics by playing 
a baked dynamics simulation on 
some event. 


% Key conflicts 


4 May not be such 
© abig problem for 
most general markets but if you 
are targeting creatives, the 
Mac-user quotient increases 
considerably. Buttons on the 
page are often a good way to 
offer alternate controls rather 
than assuming multiple mouse 
buttons or using conflicting key 
shortcuts. You can incorporate 
these into the design or let them 
stand proud — it’s up to you. 


Why not try 
creating 
pseudo-3D 
animations without using 3D at 
all? Using standard 2D Web 
animation and Flash authoring 
techniques you can create 3D 
Web graphics using 2D 
elements by making use of the 
effects of parallax, perspective 
and scale. The trick has been 
used by 2D animators for years. 


Viewpoint is a particularly compelling Web 3D format. Download 
times are quick and image quality is high. Objects are anti-aliased 
on the fly, and also sport nice soft shadows. 


®, Afterall’s said 
3 0 » and done, be 

“” imaginative. 
Don't assume that just because 
it’s 3D it’s going to be 
interesting. All too often, this 
is simply not the case. EES 


3D on the Web | 61 


62 


3D on the Web 


Create a 


Shockwave 3D game 


The most sophisticated implementation of real-time 
3D physics available on the Internet is 
unleashed here on an innocent rubber duck... 


ideogames are probably the 
most common use for 3D on 
the Net right now. Building 
them requires not only an 
understanding of 3D design but of 
programming too. The addition of Havok 
real world simulation to Shockwave has 
meant that it’s now possible to have 
objects within a game behaving as they 
would in real life: colliding, bouncing off 
one another, and moving realistically in 
reaction to forces. 

Here we're going to create a simple 


fairground game called Duckball. The 
idea is to throw a ball at a succession of 
plastic ducks in an attempt to knock 
them over the edge of the game table 
and into a pit behind it. In addition, 
we're adding a few targets for the player 
to aim at, and a timer to control the 
length of the game. All the main 
elements for a 3D videogame are here, 
and can be adapted for use in your own 
productions. We've used two packages: 
plasmato design our 3D world, and 
Directorto author the game itself. 


6) 


?>ROBOTS.NO.ANALOG.NO.YOU.YES 
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Illustration: Mike Young [w] www.weworkforthem.com, www. youworkforthem.com, www.designgraphik.com 
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Part 1: Building the game 


The first step is to build the models and the environment in which the game will take place. We're using 
plasma for this because it allows us to create HKE physics files as well as Shockwave cast members. 
If you don't have plasma, you'll need to build the physics of the game within Director... 


Just one view? 


plasma may start up showing one 


instead of four views, To change 
this, go to Customise>Viewport 
Configuration. 


Game mechanics 


When designing a simulation 
involving real world physics, 
you're not just designing what 
can be seen — you have to think 
mechanically, not just 
aesthetically. If you leave a hole 
in your floor, sooner or later 
something will fall through it 
during a game. 
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First, you need to create a camera. In plasma, 
go to the Create>Cameras>Free Camera 
menu item and choose a direct camera. Click in the 

centre of the Front viewport to place the camera. 
Now switch your perspective viewport (bottom 
right) so you can see through the camera (right-click 
the label at the top left of the perspective window 
and choose views). 


Position the floor using the move and scale 

items in the toolbox. It needs to be placed just 
under the camera and be large enough for the sides 
not to be visible through the camera viewport. 


Another wall is hung just above the end of the 

floor, leaving a vertical gap. Onto this wall you 
need to place some targets for the player to aim at 
for extra points. 


py Now start to build the environment in which 
your game will take place. The first thing to do 
is create a simple box to act as the floor. Select the 
create box icon from the toolbox and click and drag 
in the top left viewport. 


Underneath the floor create a much larger box 

and rename it ‘outofplay' - this won't be seen, 
but it'll be used to detect whether any object has 
fallen out of play. Anything colliding with this box 
will have fallen out of the game. 


8 | The targets are just cylinders (use the 
Create>Standard Primitives>Cylinder menu). 
Reduce the number of sides of your cylinders to six 
to save on processing time. Create about four 
cylinders, and place them around the wall. Each 
time you create one, click on the name box (top 
right of screen) and rename it Target01 — Target04. 


This allows you to draw out a rectangle of the 

appropriate size. When you release the mouse 
button, you can then move the mouse to drag out 
the depth of the box. Click to finish the job. 


Next you need to create two more boxes: one 

just behind the camera at the back of the floor, 
and one just in front of the end of the floor. These 
will be the front and back walls. The front wall is set 
slightly back from the floor to form the gutter into 
which the ball will fall if it misses its target. 


ag Finally, create three more long thin boxes, 
placed as shown above. These are simply there 
to help the mechanics of our simulation. The one 
closest to the camera is there to stop the ball from 
rolling back too far, and the two others form a 
shallow groove along which our duck will move. 


View textures 


To get your textures to show up in 
the viewports, click the 
chequered cube in the Material 
Editor while the material is 
selected. If it doesn't work, you've 
either not assigned that material 
to the object, or your camera view 
isn't in smooth+highlights mode 
(right-click on the top left of the 
viewport to find out). 


Placing objects 


In step 14 you need to place 
objects just above the floor 
because if an object is already 
intersecting with another model 
when play is started, its physics 
won't work correctly. 


10 | With the basic environment in place, add 
some textures. We've used Photoshop and a 
few well chosen filters to come up with some 
suitably garish colours for our fairground game. 


It's now time to turn your attention to the 
active models in the game. The first is simple 

enough. Create a sphere, call it SphereO1, and place 

it just in front of the camera, a little above the floor. 


16 | Edit this at the sub-object level (by opening it 
in the Modifier List). Opening it at the Vertex 
level, you can drag any point on the box to shape it. 


11 | Make sure mapping co-ordinates are turned 
on for all your shapes, then open the Material 
Editor. Select a wall, and click on a material in the 
editor. Now hit the Assign material to selection 
button to map the material onto the object. 


14 | The next object — a ramp the player will use to 
deflect the thrown ball — is easy too; it's just a 
prism primitive (found in the Extended Primitives 
section of the Create menu). This again is placed 
just above the floor. 


Next switch to the Polygon level. Here you can 
select the top face of the box, and use the 
Extrude and Bevel tools to start to build on our box. 


Next, open the maps rollout, select Diffuse 

Map, and bring in the bitmap of your choice. 
There are other, more advanced material attributes, 
but Shockwave won't recognise most of them, so 
we stick to simple bitmapped textures. 


The final model is the rubber duck. This is a 

much more complex shape, but you still begin 
with a basic box. Then right-click on the modifier 
box (just below the Modifier List at the top right) 
and turn this object into an Editable Mesh. 


18 | Switching back and forth between moving the 
vertices and extruding new shapes, you can 
start to build a rough duck shape. Occasionally, 

you may need to use the Cut tool on the Polygon 
rollout to split a side into two pieces before 
extruding part of it. > 


3D on the Web | 65 


Building the game continued... 


Exporting and 
previewing 

Make sure when exporting or 
previewing that the camera 
window is selected. Otherwise 
you'll be looking at your scene 
from the wrong viewpoint when 
you load it up. 
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19 | Finally, add a MeshSmooth modifier, and 
change its Iteration setting to 1, and the duck 
is smoothed out. Beware of too much mesh- 
smoothing, as too much complexity will slow the 
simulation down. 


22 In the Advanced rollout, select Define Collision 
Pairs and set this up. It's easy to decide what 
needs to collide with what, but only if you've 
appropriately named all your objects. 


Finally, you can export the finished set-up. You 
can preview the scene with the Utilities>Havok 
Dynamics>Shockwave Export>Preview in Browser 
command. This loads up a dummy Shockwave 
version of the file which, once you hit play, allows 
you to pick up and move the duck, ramp or ball. 
Test that these things work, and see that objects 
don't fall through each other before committing 
to a final export. 


Before physics will work, you have to add it to 
the scene use (Utilities>Havok Dynamics> 
Create Object>Rigid Body Collection) and click 
anywhere to add a physics object. The RB collection 
Properties box (to the right) enables you to select all 
your objects and include them in the simulation. 
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You also need to set up attributes for your 
active objects. Selecting the duck, you choose 
Utilities>Havok Dynamics>Property Editor, and give 
it a Mass of 10. The duck is a complex shape and you 
need to set collision detection as Concave Mesh. 


You need to export two files: the Shockwave 

file is first. Select File>Publish Shockwave. You 
can preview the look of the file, and check out the 
usage of memory. 


21 | You need to detect collisions between the ball, 
the ramp, the duck and any of the other 
objects. However, you can turn off collisions 
between the various boxes and walls and each other 
because none of them will ever move. 
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The ball is made heavier at 20 and the ramp is 

given a Mass of 60. Both of these are simple, 
convex objects, so you can use Mesh Convex Hull 
collision detection. This speeds up your simulation. 


The second is the physics (HKE) file. Use 

Utilities>Havok Dynamics>Shockwave 
Export>Export and the attributes of your objects 
will be exported to a separate file. 


Part 2: Directing the models 


Now it’s time to move into Director, where you can begin to write the code 
that will give your 3D objects their behaviour... 


Load up Macromedia Director and start work. 

Set up a decent sized canvas (640x480 — alter 
this setting in the Movie tab of the Property 
Inspector), then right-click on the cast members 
window to import your two files. 


You need to drag the Shockwave file onto 

the canvas and place it centrally, leaving a 
gap at the bottom where you can place your score 
and time information. You now have 3D in your 
Director movie. 


First, however, you need to add a text cast 
member into which you type the word Score, 
and another containing the word Time. Place these 
on the canvas, just under the Shockwave file, and 
add another two text members — each with an 

‘O' in them. 


Name these ‘scr’ and ‘tme' (select the cast 

member and type in the new name). Giving 
names helps you to reference the score and time 
displays later when you come to update them. 


Stationary objects 


If your objects don't move, you 


probably haven't assigned 


their masses correctly in =a 
Thcceers spt as 
plasma. If they fall through the RETURNS. ‘t5tring® as 


floor, it's your collision set-up 
that's at fault. 


end getBaheviortasl Tis 


Learn the Lingo “PURPOSE: Provides « teheviar description in the bebariar sospector 
~~ACCESTS. ‘sSeript® os a reference to s script aesber 

wat, er |—seTURNS: ‘tString* 4s 3 string 

Writing Lingo isn't the only way to SE sekntatcemiereer Sater 


bring your 3D productions to life. 
Some 3D behaviours are 
included with Director, and you 
can download many more from 
the Internet. These can often be 
ret 


helpful in creating certain effects, 
but if you're serious about Web 


3D, you're going to have to take 8 | It's now time to start coding. Director's 


programming language, Lingo, contains 
hundreds of commands and keywords. We're not 
going to try to give you a full understanding of it 
here, but you should get a good start. 


Now, when you hit play, your scene is in 
motion — not a lot of motion, but the ball, 
duck and ramp all fall from where they were placed 

until they hit the floor. 


the plunge into Lingo. 


The problem is that it doesn't do anything. 
Hit play and the scene remains stationary — as 
though it's a still image. You need to gain access 
to the scene and start addressing the objects within 
it by name. 


G Now open the Library palette, and pick the 
Setup>Havok Physics (HKE) behaviour, which 
you need to drag and drop onto the scene on the 
canvas. A dialog appears, asking which Havok 
physics file you want to associate, and you'll need to 
pick the only one you have. 


a Double-click on the very top square of the first 
frame in the Score window. This brings up a 
code window in which you can enter the commands 
to be executed when the game begins. > 
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Code positioning 


The code in steps 12-15 needs to 
be executed each time the frame 
loops, so we put it between the 
ON EXITFRAME, and GO TO THE 
FRAME commands. Remember 
all the code is in Shockwave 
game\Script for ducks.doc on 
ourcover CD. 


Individual 
co-ordinates 


The co-ordinates fed into the 
attemptmoveto commands that 
appear in steps 17 and 18 are 
right for the example we built, 
but your own models might be 
built to a different scale, 
meaning you'll have to find your 
own co-ordinates for objects. 


Ball-motion 
settings 


We have to set the motion and 
rotation of the ball to zero in step 
17 because when it flies off the 
end of the playing field, it’s likely 
to be moving and spinning fast. If 
we just placed it back on screen, 
it would still have the same 
momentum, and could fly 
straight off again! 
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Pon exitfrane ae 
globs! scorel.duckhit.tim.ballhit.t1.t2.t3.t4 


tam=100 
t1=0 

t2=0 

t390 

tad 
scorel=0 
duckhit=0 
ballhited 


10 | Enter the code above or cut and paste it from 
the Script for ducks.doc on our cover CD. This 
resets the score, timer, and various other variables 
before the game starts. The game will consist of two 
Director frames: this frame to set the game up, and 
the next frame for the game itself. The second 
frame will loop constantly during play. 


if, Keypressed(*.*)then 
MEMBER( "ball gana”) rigidbody("Sphere0! *). epplyinpulee(vecter(30.0.0)) 


)then 
("ball gas") origidbody ("5p 


#01") applyimpulse(vecter(-30.0,0)) 


if keypreased(* *)then 
MEMBER(“ball gane") rigidbody( ‘Spherel1*).epplyiapulse(vector(0.800.0)) 


Setting up keystrokes for moving the ball left 

and right, and a much larger one for throwing 
the ball forward, completes the motion of the ball. 
You can now hit play and roll the ball around with 
the keys. 


on ballfall (me.collisiondetails) 
global ballhit 
ballhit=1 


end 


Once the collision is detected, the line hands 

over to the ‘ballfall’ routine. This routine will 
detect each instance of the collision — which could 
happen several times per second —so all we do is 
make that routine set a variable to 1 so that we can 
handle the collision elsewhere just once. Unlike the 
rest of the code, these lines are placed outside of the 
program loop — just after the final ‘end’ command. 


on exitFrame ne 
global scorel.duckhit,tim,ballhit,t1.t2.t3.t4 


go to the frame 
end 


11 | Next, create code for the next frame. This will 
be the main body of our game, so type the 
code as above. This makes sure the game 
continually loops, and sets up all the variables 
you'll be using within it. 


at (-2* then 
eat ("bell game") xigidbedy(*renp") epplyinpulse(*metor(-2i00.0.9)) 
end 1 


it, keypressied (“x")tben 
MENBER(“bs1l game") rigidbody(*reap*) applyiapulse( meter (2109.0, 00)) 
end if 
"q" )then 
“bail gare"). rigidbody(~ranp") spplyimpulse(wectar(00.2100,0)) 


rey I 
el ("bail gone”) rigidbody("ranp") applyimpulse( vector (00.-2100,0)) 
at 


o Do the same for the ramp, giving it a different 
set of controls. Because the ramp is heavier 
than the ball, it needs a bigger force to get it 
moving. The game is beginning to take shape. You 
can even knock the duck out of play if your aim is 
good enough. 


SE BaLlbites then 
‘A°MDABER("balT "gene" ) rigidbody("Seers01") atvenptacweto(wactar(2,—06.23), (yeotost, 0 
WENGER “bell game") rigiddedy("Sphered!").angularvelocity=(ymotar(0.0.0)) 

MEXBER( “bell Gene") rigidbedy("Snhesodi") linearvelocitys(vecter(0.9-0)) 
Batiniteo 
end it 


rq) You can then use the code above in the main 
code loop to detect when the variable is set to 
1. Move the ball back to the starting point (just 
above the floor in front of the camera) and set its 
motion and rotation to 0. Finally, the variable ballhit 
is set to O again so we don't do the collision routine 
again until the player throws the ball once more. 


it Meyppegaed(“_~)chen 
(ball game"), rigidbody( "SphereD 1"). applyinpulse(Wedter(30,0,.0)) 
end if 


Now for the fun stuff. Let's start with the 

player's ball. Use the ‘keypressed’ command to 
detect when a key is pressed, and the ‘applyimpulse’ 
command to give the ball a shove when it is (the 
strength of the force in the X, Y and Z directions are 
the numbers above — our code creates a force of 30 
in the X direction when the '.' key is pressed). 


nadbeie("boll gahe") reyisterinterwat(‘outot ley", “Sphere01".2,0,#ballfall ne) 


The problem is every time you throw the ball, it 

drops out of play, never to return. What you 
need to do is make Director detect collisions between 
the box you put under the floor (the ‘outofplay’ box) 
and the ball. This is done with the code above. (The 
entire script is available on our cover CD.) 


swenber( “bell gare") registerinterest (‘outofplay®.“duck* 1.0, 4duckfall ae) 


AU duchibst1 then 
storelsacoreis1 000 
SpROPH Cet sone") ragidbosy (“duck”) at tonptacvesoywnchor(-220 
Absit Goan") rigidbody( Suck) lanearveiocity: (wactort 
MREBER( bel ane) Fagidbody( “Sch” ) angutarveloct y+ (wekar( 
docknst-o 
ond af 


on duckfall (me,collisiondetails) 
global duckhit 
duckhit=1 


en 


The same type of routine is used to detect and 

replace the duck if that's knocked off the edge. 
The only addition is the line score1=score1+1000 
which quite simply gives the player 1000 points for 
knocking the duck out of play. 


o*) registerinterest( “tan 
registerinterest ( 
registerinterest (* 

s*) registerinterest ( 


on tlfall (me.collisiondetails) 
global t1 


ti=1 
end 


on t3fall (me,collisiondetails) 
global t3 
t3=1 

end 

on t4fall (ne,collisiondetails) 
global t4 
t4=1 

end 


You can even use the same tests to find out 
whether the ball hits any of the targets, and to 
allocate points accordingly. 


member ("labeli") text=string(scorel) 


All that's required now is to update the score 
22 
on the screen. The line above simply replaces 
the contents of the ‘scr’ text object with the player's 
current score. 


rigidbody (“duc 
) wagidbody(“duck"), 1inearvelocaty=(vectar(20.aoveanty:aoveant =) 


) Linearvelociry 


Right now, the duck isn't actually moving. Use 

the command above to make it sail across the 
screen (you could have applied impulses in the same 
way you did with the ball and ramp, but a constant 
force would have made the duck accelerate 
constantly, and a single prod would have just pushed 
it over!). The ‘linearvelocity’ command just moves it 
a given amount for each loop of the game. 


if the timer>60 then 
tim=tim—1 
starttiner 
if tim<0 then go to frame 0 
menber ("time"). text=string(tim) 
end if 


Finally, you need to put in a timer so the game 

re-starts after 100 seconds. Shockwave's 
TIMER function gives access to a clock that marks 
1/60th second intervals. All you have to do is tell it 
to re-set every time it reaches 60, and decrease the 
timer value by 1. 


Currently, when the duck sails off the end of 

the screen, it eventually falls off the field, and 
is replaced at the left of the screen. However, this 
gives the player points. You don't want that, so add 
in another line to replace the duck when it gets to a 
certain position at the right of the screen. 


When the timer reaches zero, re-start the 

game (remember, on the first frame there's 
some code to set the timer back to 100 and the 
score back to zero). The other line here simply sets 
the on-screen text next to the word ‘time’ to our 
timer's value so the player can see the countdown. 


—— 
Part 3: Exporting 


With your game finished, you'll want to export it as a Website. This is easy... 


Publish Settings 


Formats| General Shockwave| Compressin| Shockwave Save| 


HIML Template: [a0 Content Loader x] 
Description: [Thies the defouk Publish template for 


HTML File: [duck2.him : 
Shockwave Fie: [duck2 der AR = 
Ne 98 z cae j 4 


macromedia 
SHOCKWA\) 


HWAVE 
=: 1 


Dutput FF View in Bowser 


sa Go to File>Publish Settings and choose a set- 
up for your Web page. You could write your 
own HTML code, but there's little point when there 
are some very nice presets already designed for you. 
We selected 3D Content Loader, but others allow 
for your movie to be stretched to fill the browser 
window, or even introduced with a simple breakout 
game while it's loading. 


Hit File/Publish. This saves out not only your 

Director file in a locked and compressed form 
ready for Internet distribution but also a small 
loader bar which shows the user the progress of 
download for the game, and an HTML page into 
which it's embedded. 


When it's finished, you can view the page to 
see how it's turned out. Playback will usually 
be smoother and faster than playing the movie 
within Director. You can now take the files 
generated and upload them to your Internet site. > 
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Part 4: Improvements 


You can use the Director file on the cover CD as a starting point to make improvements to our game. 
These should give you a better understanding of some of the things you can do with Shockwave... 


if ti=1 then 
scorel=score1+200 
t1=0 


sound(1) -play (member ("bonus") ) 
tim=tint10 
end if 


The code shown above adds a random element 


How about a sound? Import a suitable sound into the duck's speed. In order for it to work, 


Try giving the player extra time if they hit one into the cast members window, name it you need to add the variable ‘Duckspeed’ to the 

of the targets — it's easy. Just put the line “bonus” then use the command above in the global variables list at the top of the code in both 
Tim=Tim+10 in the collision detection routine for collision detection routine. The noise will play frames, and put the line Duckspeed=30 in the first 
the target as above. whenever the target is hit. frame's code. 


Updating code 


Remember, if you've inserted 

any code that specifically 

mentions frame numbers, you'll 

need to update it. a 

Rott Up! Fretl.Hpe! Ratt Cel on mouseUp me 
go to the frame +1 


end 


| 
| 
| 


| : G Finally, write a couple of lines of code so that 
——$$$__—_—_— the game will loop within this frame until the 
user clicks the screen. Add a ‘go to the frame’ line in 
Now, design some graphics giving instructions _this frame's script, and right-click the graphic itself 


4 | Put in a pre-game screen. In the Score on how to play the game. We've used to add the script above to turn the page into a 
window, grab all the elements of your shot Photoshop, but any graphics package will do. button. Now the game looks more complete and 
including the script items in the top row of the Load this image in as a cast member, and drop it professional. You could even play a tune while the 
score, and move them one frame on. onto the canvas. player is reading the instructions. 


nonber( “ball qane") registerinterest (“Sphere0i", “duck” 1,0. #duckkill me) 


on duckkill (me,collisiondetails) 
kdead 


global duci 
duckdead=i 
A 


9 | Get the targets to move. You have to use 
8 | Then remove the duck instantly and place it at different code here because the targets aren't 


the side of the screen ready to roll on again. If subject to the physics simulation that the ball, ramp 


you were creating a really advanced game, you and duck are given. They have no mass, and thus 
could use a particle system to create an explosion, can't be moved with forces and impulses. You have 
Kill the duck. Instead of just knocking the duck —_ or replace the duck with a rectangle and project an to move the models directly. The code above 
over, why not destroy it when it's hit by the explosion animation onto it. If you can work out (remember, it's also on our cover CD) spins and 
ball. As before, you'll have to make a collision how to do this, you'll be well on your way to any moves the target, and replaces it when it moves off 
routine for the ball hitting the duck. game you want to create. the screen. Try making the motion more complex. 
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[2 Member] F% 30 Model] BB Castf 
*pfies2 [15703 [2782 ape 
Gss0 [oo [000 Kye 
P Oitect to Stage IF Preiosd 
Play Animation 
F Loop 


Reveit to World Defaults | 


L] 
a 
[hotenze 


10 | Finally, here are three ways you can alter the 
look of your movie. The first is the simplest: 


when you create your project in the first place, you tt | Now let's add some fog. It's not really 


You can also change the look of the scene 
entirely by adding a toon modifier to any or all 
of your objects. This changes the objects into 


can add lights. However, you can also change the appropriate for this project, but many worlds cartoon versions, by simply adding the line: 

lighting by selecting the 3D item in the Cast can be made much more atmospheric with a little member(“ducks").model(“duck").addModifier(#toon) 
window, and using the Property Inspector to pick a fog. All you need are the lines above, which define Simply replace the model “duck” with any model 
lighting preset. 


the fog’s colour and range. you want to turn into a cartoon, GEES 


eee 
Inspiration: Visit these Websites to see what's possible with Shockwave games... 


re ——_ 


http://w ww.gorillaz.com 
The Website for the band Gorillaz. This contains a great 
little driving game based on one of the band’s videos. 


http://w ww.shockwave.com/sw/content/cueball 
A pool game, simple dynamics, but a great 

demonstration of what 3D physics can do. A very 
sophisticated implementation. 


http://insight.director-3d.com/studio/ keys/# 
An adventure game. This uses a whole range of 3D tools 
including bones animation to create characters. 


http://w ww.liquid.se/pong.html 
Simple but effective. A 3D version of the 
80s tennis game, Pong. 


http://w ww.arcadepod.com/shockwave/ 
Arange of 3D games are available here including 
Alien X, a Doom-style shoot-'em-up. 
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Creating a 
3D online store 
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is coming 


After a long and shaky start, 3D on the World Wide Web 


of age. Here’s our quide to viewing and creating interactive 3D 


objects for the flet... 


hy bother with 3D on the Web? Well, as a 
consumer, being able to interact with a 
3D model in realtime is going to help you 
make an informed purchasing decision. 
You can look at potential mobile phone upgrades 
without trekking round the high street. If you're a 
company with a product to sell then having a 3D 
model of your product online is an excellent way to 
reach customers. 


History lesson 


Historically, 3D on the Web has often been a bit of a 
disappointment. Obese 3D files seemed to take 
forever to squeeze their bulk through our 56k 
modems. We were sent from pillar to post to 
download the plug-ins required to view the 3D 
content. Invariably early VRML (Virtual Reality 
Modelling Language) creations weren't sophisticated 
enough to warrant the time and effort it took to get 


kforthem.com, www.designgraphik.com 


Illustration: Mike Young [w] www.weworkforthem.com, www. youwor! 


Cycore's Cult3D Designer enables you to create interactive 
photorealistic 3D objects that can be rotated, panned and 
zoomed around. This car was created to show how Cult3D can 
be used to market a vehicle. You can add new spoilers to fine- 
tune the car and change its paintwork with a click. Check out 
the object at [w] www.cult3d.com/gallery/. 


What, no plug-ins? 


How does Java allow interaction with a 
3D object without a plug-in? 


A Senior Lecturer in Digital Media, Marcus Leaning brings us 
up to speed: “Java is a powerful compilable programming 
language that was initially intended to allow different domestic 
electronic devices to be able to talk to one another and operate 
together. In order to do this, Java was designed to be platform 
independent. This quality made Java a very useful tool when the 
Web became big in 1994-1995 as it allowed software to be 


developed that could run on many different systems.” 


So companies like Kaon take advantage of the fact that our 
Mac and PC browsers can happily play Java Applets without 
a plug-in? 

Marcus explains: “Java applets work as the code is 
downloaded as part of a Web page and then the browser 


compiles it and lets the program run.“ 


Java is usually automatically enabled by your browser. If the 
Java applets don't play, check your preferences. 


hold of them. Time has moved on and Web 3D has 
matured enough to be worth another look. The advent 
of broadband and the evolution of more efficient 
software have taken some of the pain away from the 
Web 3D experience. Creating interactive 3D products 
for the Internet is big business and there's a large 
variety of companies and formats clamouring for your 
attention. Let’s look at some of the main contenders 
in the Web 3D arena. 


Cult following 


First off, let's take a look at Cycore’s Cult3D. You can 
put interactive 3D objects together using the free 
Cult3D Designer (downloadable from [w] 
www.cult3d.com/download/designer/). This allows 
you to apply interactivity, sound and special effects to 
models exported from Maya, 3ds maxand 3D Studio 
Viz. Its drag-and-drop interface makes it easy to 
create and rearrange event sequences. The preview 
window shows you the results of your work so you can 
tweak the object until you’re happy. When you've 
finished fine-tuning your Cult3D object in the 
Designer, you have to publish it. To publish it you need 
to buy a licence. The price is set by the number of hits 
your site receives (there are several ranges to choose 
from). Fortunately there’s also a free non-commercial 
licence. For people to view your Cult 3D object in their 
browser, they'll need to download a plug-in installer 
from [w] www.cult3d.com/download/download.asp. 
The downside is that there’s currently no Cult3D 
Viewer plug-in for browsers native to Mac OSX. You 
have to switch to Classic and install the plug-in to 

your old Explorer 5.0 browser. However, a native OSX 
Cult 3D viewer is promised in “the near future”. 


Over the Edge 


MindAvenue’s AXELedge and AXELcore (the cheaper 
cut-down version) allow you to create the 3D content 
directly within the package (see our AXEL tutorials 
starting on page 40) instead of having to use Maya or 
other third party products. However, you can still 
import VRML objects from 3ds max and Maya if you 
prefer. AXEL has an impressive set of modelling and 
animation tools that you can use for creating 3D 
products. You can use it to create complex interacting 
objects without the need for programming. You can set 
up your own object interactions or use AXEL's preset 
library of sensors and reactions. Once you've 
previewed the object in your Web browser, you have to 
‘publish’ it. AXEL generates an HTML source code 
which embeds the 3D object in a Web page. You then 
simply copy and paste the code into the HTML of your 
own site. Once you've bought the software there's no 
additional licensing issues so it’s a simple matter of 
getting your object online. The downloadable demo 
version features some sample projects and a well- 
written HTML-based tutorial that takes you through 
the whole process of modelling and publishing your 
object. To view the AXEL-produced object you'll need 
to download the AXEL player. You can get one from 

[w] www.mindavenue.com. 


Pulling the plug-in 
Not every Web 3D object requires a plug-in to play it. 
Award-winning Kaon allows Web users to interact > 


This TV was created within AXEL and can be manipulated by 
dragging the mouse. It also contains interactivity. Clicking on 
the remote control triggers a movie and sound sequence to play 
on the TV screen. Download an AXEL 30-day trial for Windows 
or Mac OSX from [w] www.mindavenue.com and check out the 
TV demo for yourself. 


+ Add Hotspots to call out key features 
+ Chack fine detail of product graphics and 


Use the interactive zoom, rotate and measure icons to examine 
the photorealistic Kaon-created model. The anti-aliasing is 
particularly impressive even in extreme close-up. Check this 
CD player out for yourself at [w] www.kaon.com/gallery.php. 
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Using Shockwave 3D you can create simple primitives in 
Macromedia Director or import more complex objects from a 
third party package and manipulate them as sprites. 


3D on the move 


3D interaction — coming to a mobile 
phone near you... 


With broadband becoming more prevalent, low bandwidth is 
becoming less of a hindrance to delivering 3D files to our 
desktops. But when can we expect to interact with 3D objects 
on our beloved mobiles? The forthcoming 3G mobile networks 
will allow a higher bandwidth for data to be downloaded to a 
mobile phone. Once the data is downloaded, Imagination 
Technology's PowerVR MBX chip should enable us to view 
PlayStation quality graphics on our mobile. This is possible 
because unlike conventional systems the PowerVR chip allows 
a scene to be partitioned into small tiles, each of which is 


rendered independently. 


The PowerVR chip's tile-based rendering hardware enables 
high quality 3D objects to be manipulated once they've been 
downloaded to your 3G mobile phone. 
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with high quality photorealistic images without a plug- 
in. It achieves this by making its content run in a Java 
applet that any PC or Mac browser (Explorer 4.0 and 
Navigator 4.5 and higher) can read. A major advantage 
in using a Java applet is the low size of the file (under 
250k). The Kaon model is downloaded in stages with 
each stage increasing the resolution. You can begin 
interacting with the first stage before the textures have 
loaded. The anti-aliasing on the models is particularly 
impressive. But how do you create the content in the 
first place? 

One option is to send photographs of the object 
from different angles to Kaon. They use the images to 
create a photorealistic 3D object. The entire process 
takes less than four weeks and costs about the same 
as conventional photography. The fee to create a 3D 
model varies depending on the complexity of the 
object, the number of component parts and your 
animation requirements. Once the model is built it’s 
sent to you in Web-ready form. It can be added to your 
site's directory just like a normal JPEG file. As with 
AXEL, once you've added an HTML reference to the 
file then viewers can interact with the 3D object 
online. If you pay for Kaon to make the model for you 
then it comes with its own seal. A seal is needed to 
allow the model to be played in the Java viewer. If you 
buy the Activate!/3D Author to create your own content 
(using files imported from 3ds max for example) then 
you get 50 seals. 


Shocking 3D 


Macromedia’s Shockwave Studio has long been a 
popular way to put interactive content on the Net. 
Macromedia Director 8.5 Shockwave Studio now 
contains a 3D component. The advantage of using 
Shockwave 3D is that many people are already 
familiar with Director for creating Web content, and 
many users already have the Shockwave Player 
installed in their browsers. Shockwave Studio 
supports files exported from the several popular 3D 
authoring packages. You can create simple 3D 
primitives directly within Shockwave Studio. For more 
sophisticated modelling you can export your 3ds max, 
Maya and Softimage XS/files and manipulate them in 
Shockwave Studio. Download the Shockwave Player 
from [w] www.macromedia.com/downloads/. 


Swift 3D 


If you’re new to 3D but want to 3D-ise the products in 
your online store, Swift 3D is a good place to start. 
Electric Rain's Swift 3D is designed to take the Web's 
low bandwidth limitations into account by producing 
vector-based 3D models. It’s primarily aimed at Web 
designers who use Flash to create their interactive 
online content. For this reason it’s geared up to 
producing a flat shaded cartoon-style 3D object. 
While you can import DXF files to be converted to 
vectors, you can also use Swift 3D’s own modelling 
tools to create your objects. There are also Swift 3D, 
3ds max and Lightwave plug-ins available if you want 
to model outside the package. Most users have the 
Flash plug-in downloaded for their browsers so your 
3D product could soon be out there for all to see. 
Check out [w] www.swift3d.com for some examples. 
Swift 3D is available for PC and Mac (though OSX 
users will have to run it in Classic). 


This vehicle was created in Maya and turned into an interactive 
3D Shockwave movie. As well as rotating the 3D object 
interactively, clicking on the doors triggers an animation 

to open and close them. Check out the movie at 

[w] www.aliaswavefront.com/en/Community/Special/ 
shockwave/shockwave_m.html. 


Swift 3D's advanced modelling tools let you lathe and extrude 
complex shapes. You can preview your animation and shading 
styles before exporting to the Web-friendly SWF format. 


Make online objects spin 


27 steps to creating a spinning object that'll run in QuickTime. 
formats for viewing interactive 


i 3D objects on the Web. One 
format is QuickTime VR(QTVR). We'll 


s you'll have already read in 
this issue, there are many 


show you how to use any 3D package to 
create, animate and render a model to 
become a QTVR object viewable in both 
Mac and PC browsers. Let's unleash an 
all-terrain 3D skateboard on the Web. 


Part 1: Hit the deck 


Before we make the object interactive let's start off by building the deck of our skateboard... 


Retrace your steps 


When working in 3D it's easy to 
make mistakes. Save your work in 
increments (Skateboard01, 
Skateboard02, and so on). You 
can then easily retrace your steps 
if things go wrong. It is especially 
important to save a version of the 
model before you start animating 
as this is often an area in which 


you'll make errors. 


Create a polygon cube. Scale it in the X, Y and @ xt the facets or control points on the front ex the polygon facets and smooth them by 
Z axis to give it a more appropriate board-like | 2 Be back edges of the cube. Scale them in the OD icing more subdivisions to the cube's 
shape. Add some extra subdivisions to the cube to Z axis to make the end of the board more pointed. geometry. Add a deformation lattice to the cube. 
give it more geometry. This will give you more Use the top view to make sure that you only select Move the lattice points at the front and back up in 
modelling control when refining your board's shape. _ the relevant facets at the ends of the cube. the Y axis to elevate the ends of the board. 


Part 2: Let's roll 


The board needs to be able to tilt from side to side as the front axle pivots the wheels left and right... 


Parent/child 
relationship 


To link up a series of objects ina 
parent/child hierarchy use your 
package's outliner or schematic 
view. This will give you a clear 
visual link between the objects 
and make their relationship 


easier to control. 


wy cc a primitive NURBS cylinder for the axle. eo‘ the top part of the pivot mechanism create For the lower part of the pivot create another 
Osi it so that it overlaps the edges of the | 2 polygon cube. Move and rotate its facets to NURBS cylinder and align it with the axle so 
board. Select the control points at the ends of the create something similar to the shape shown. that it is slightly larger in diameter. Select and move 
sphere and scale them down. Pull the end points out —_ Position the cube under the front of the board the control points on top of the cylinder to create 
a bit more so you can fit a wheel on them. where it tilts up. the shape shown. 


a G Place a couple of capped cylinders inside the 
4 | Create a tyre using a polygon torus. Change tyre as hubcaps. Group the wheel and 


Now link up the components. Make the wheels 
the radius of the torus to getalarger holeinthe duplicate it. Scale the duplicate in the Z axis and 


children of the axle. Make the axle a child of the 
lower pivot. Make the deck a child of the upper pivot. 
Now you can tilt the deck and it will pivot realistically. 
You can rotate the axle left and right accordingly. > 


middle so that it looks more like a tyre and less like a stick it on the other end of the axle. Duplicate the 
doughnut. If your software allows, extrude the faces __ pivots, wheels and axle and place the duplicates at 
slightly in the Z axis to create that rubber tread look. the other end of the board. 
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Part 3: Texture time 


It's time to get out your virtual airbrush and customise your board. If you use the QTVR format to play 


your online interactive skateboard, there's no limit to your texture's quality... 


Ge Take a snapshot of the board from the top 
view. Bring it into Photoshop and use it as a 
guide to create your own skateboard design. (Or 
use our Dragon.jpg image from the CD.) 


2] Apply the texture to the board in your 3D 
application. You may have to scale and rotate 
the map to fine-tune the fit. 


3) Create and apply textures for the tyres, axles 
and wheel caps. If you're using the dragon 


texture from the CD, apply the image hub.jpg to 
the wheelcaps. 


Part 4: Animate and render 


You need to animate and render the model so that it will be suitable for conversion as a QTVR movie that 
can be viewed on the Web... 


QTVR quality 


Using the QTVR format means 
you don't have to limit the quality 
of the final render. You can 
raytrace at a high quality 
photorealistic setting because 
QuickTime VR consists of a 
series of still images, not as a 
real 3D data. Because you will 
‘photograph’ the board from 
every angle you'll be able to 
rotate around it online as if it 
were a genuine 3D object. 

(It's a bit like the bullet time 
technique from The Matrix, 
where an action is photographed 
simultaneously from many 


angles by multiple cameras.) 
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ap To see the QTVR object from every angle 
you'll need to render frames of the object from 
every angle. In effect you are going to scan your 3D 
skateboard like you might do with a real object 
using a 3D scanner. Keyframe the skateboard to 
rotate clockwise 360 degrees over 36 frames. 


Place the virtual camera side-on to the 

skateboard and render the first row of 36 
frames. For later insertion into QuickTime VR 
Authoring Studio label the frames numerically (for 
example, row01.frame01, row 01.frame02 etc.). 
Don't forget to hide the camera control sphere 
before you render. 


As the board rotates, animate the deck to tilt 

left and right and keyframe the front axle to 
turn to show how the pivot mechanism steers the 
board. Make sure everything is in the default 
position at the start and end of the rotation so that it 
can loop seamlessly. 


Step by step rotate the camera ten degrees in 

the X axis and render a new row of 36 frames. 
Do this ten times to render every frame in the 90- 
degree arc that the camera passes through. 


To 


3] To move the virtual camera step by step 
through an arc of 90 degrees create a sphere at 
the centre of your 3D space. Make the camera a 
child of the sphere. When you rotate the sphere in 
the X axis, the camera will move up but will remain 
pointing at the 3D object. 


You'll now have rendered the same sequence 

of 36 frames from ten different angles. That's 
ten rows of 36 frames giving you 360 individual 
frames which you can stitch together to make a 
QTVR object viewable from various angles. 


Part 5: Creating a QTVR object 


Software like Kaon's Activate!3D Author and Apple's QuickTime VR Authoring Studio creates a QuickTime 
Object file. We used Apple's package to bring our 360 skateboard frames into one interactive movie... 


Mac and PC 
friendly 


QTVR (QuickTime Virtual 
Reality) is traditionally 
associated with 360-degree 
panoramas stitched together to 
allow the user to pan around a 
room or landscape. QuickTime 
VR Authoring Studio also allows 
you to rotate around a fully 
rendered 3D object in real time 
The advantage of using 
QuickTime VR (QTVR) to present 
a 3D object to clients is that Mac 
and PC browsers can play the 
QuickTime format. Check out [w] 
www.apple.com/quicktime/qtvr 


/authoringstudio/index.html 


In QuickTime Authoring Studio create a new 

QTVR Object Maker. In the source images 
section click on Define Object. To fit in all your 
rendered skateboard images you need ten rows and 
36 columns. Make sure there are ten degrees 
between each row and column. 


4 | Set the Compression to Sorenson at high 
depth. Make the Horizontal Controls wrap 

so you can keep rotating the file horizontally. This 
will take advantage of the fact that the animation is 
set to loop through 360 degrees. Reverse the 
Vertical Controls. 


Use a WYSIWYG (What You See Is What You 

Get) package like Dreamweaver to put the 
QTVR movie into a Web page just as you would 
with a jpg file. Dreamweaver will automatically 
create the HTML that embeds your QTVR movie in 
the body of the Web page. 


Click on the Add Files button. Select the folder 
storing your 360 images. Click on Add Alll. If 
your files are labelled numerically (Row01.01, 
Row02.01, etc.) they should drop into the correct 
boxes. Check they aligned correctly by clicking the 
pull down arrow to read each file's name. 


Click on Make Object. The Progress box will 

show you the sequence of 360 frames being 
processed row by row as the QTVR object is being 
created from the source frames. 
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8 | Upload the SkateboardQTVR.mov file to the 
images directory of your site and upload the 


html document that refers to the embedded QTVR 


file into your .html directory. Type in the URL and 


you should be able to see and manipulate the QTVR 


object online. 


g In the Object Maker Settings go to Object 
and set the framerate to match the one you 
rendered the original frames in. In our case the 
skateboard frames were rendered at 25 frames 
per second 


When the rendering is complete, the finished 

QTVR object appears in a new window. Test it 
to make sure it rotates and tilts realistically. You can 
zoom in and out of the scene by using the Control 
and Shift keys. 


Instead of having to download it, check out 
our own interactive skateboard QTVR movie 
on the cover CD (SkateboardQTVR.mov). EEE 
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On and familiarisation, you 
Ould soon be creating some reasonably 
unique effects in a matter of seconds. 


Part 1: Xara3D basics 


Creating the groundwork for your animation... 


Shadow play 


An object's shadow can be 
positioned through click-and- 
drag methods ina similar way to 
the main object. You canalso 
change the colour, transparency 
and blurthrough its respective 
tool in the left-hand toolbar. 


Talal Fre wes] fr 00 = le albe 38 2) 


g@ Launch Xara3D and take a moment to 
familiarise yourself with the interface and 
layout of the software. Various tools and the usual 
file-type features are found along the top and left- 
hand side, and a selection of design and typography 
options run along the bottom. 


a" The colour options can also be reached via the 
button beneath the Text tool. Use the drop- 
down to choose the Front, Back and Sides of your 
object and set this to white. You may not notice an 
immediate difference due to the lighting colours. 


ie 
Co) ven 


SBLO/F 3) 3/03 wpe alfie ays 


Select the Text tool and overwrite the default 

copy with your own and change the font face 
to Balthazar, which is one of the six free fonts 
included with Xara3D. Further editing can be done 
through the options at the bottom of the interface. 


f= BLO a Ums ie aia 

3 | To adjust and position the object, simply click 
and drag the object around. This direct 

method applies to most objects within the Xara3D 

environment, such as shadows and lighting, and 

other effects. Double-click the background to 

switch to a white colour. 


pie Maem 


5 | Alternatively, you might choose to apply a 
texture to your text by selecting the 
appropriate option from the right-click contextual 
menu. The same menu enables you to import 
background images as textures. 


AMBDONSS 


oO The light bulb button in the top toolbar reveals 
the light sources. The arrows indicate the 
colour and direction of the lighting and can also be 
directly moved around. Again, double-clicking on a 
lighting arrow allows changes to be made. 


Part 2: Shaping and modelling 


Tweaking the appearance... 


Instant buttons 


Xara3D's Button Editor is not 
needed to create a simple 
screen saver, but the tool can be 
found in the left-hand toolbar 
and allows button boundaries 


to be created instantly around 


i | 
one | | 


your creations. @ Man Front face 
© Gloss Back face ) 
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The third button on the left-hand toolbar 

allows edits to be made to the text extrusion. 
Change to a matt setting and activate the Outline 
option with a width of 10 pixels. Set the Depth to 
12 and click Close. 


Next we'll change the bevel through the 

button marked with a B. From the available 
options choose the Square incut option and set the 
depth to 10 and click close to remove the bevel 
options pop-up. 


at 
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If constantly opening and closing the various 

pop-up options becomes too tedious and you 
have enough screen space, try dragging and 
docking them to the left of the interface so that 
they're constantly available. > 
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Part 3: Getting animated 


Adding movement to your screen saver... 


Cop i) 
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Importing graphics 


Xara can just as easily work with 


3D 
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imported 2D shapes on which | Dw | wee ice! 


me 


you can use all the features 
mentioned here, including 


Frames per cycle : fao 
Frames per second : [25 


Pause :|100 cs 


T~ Loop 4 times (GIF only) 


extrusion, bevels, lighting and 
positioning tools. You can also 
import animations, buttons, 


= Do Kot Disturb + 


styles, graphics and more. 


T Loop | fmes (GIF only) 
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_ UI Faas Be WOE ae a eae F¥ Front face only Style : [Rotate 1 | 

Found at the bottom of the left-hand toolbar I Front face only 

is the button that toggles the animation Curiously, the Play control for the animation is 
controls into operation. For ease of use, drag this to found in the top toolbar to the left of the Back to the Animation options. Set the Frames 
the left of the interface so it docks and you can lighting button. Hit this to see your text animate to per cycle to 40 at 25 Frames per second. 
then see more easily how your changes affect the the current settings and leave it turned on to see Adding 100 cs of Pause will hold your text in place 
overall results. how your changes affect things on the fly. for a short while at the start/end point. 


Frames per second: |25 
Pause:[0 cs 
T Loop:[ tines (GIF ony) 
Syle:[Raae2 >] 


I~ Front face only 


‘3D AlternatelinesRotatetb.x3d 3DPulsate2aQverlap.x3d 3Dswingibwa) | 
}| ‘BDAlternateLinesSwingt.x3d SD Pulsate2cWave.x3d 3D Typewriter 2} i 
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| Fies of type: [xara30 (x30) =] Cancel | 
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5 | We've gone for the Swing 2 style restricted to : 
4 | Experiment with the various predefined Style an angle of 45 degrees rotating around its G If tweaking such settings doesn't have much 
options to see how they affect your animation. _ horizontal axis. We've also applied the Wave appeal, you can plump for the Animation 
Notice how the available options below adapt effect at 200 per cent as this gives a less rigid flow picker, which gives you a range of predefined and 


depending on the selected style. to the movement. modified styles to choose from. 


Part 4: Exporting your work 


Creating the screen saver file... 


Xara to Flash 


Xara3D now supports export to 
the Flash SWF format by 
choosing the relevant extension 
via the File>Export menu. 


pb ¢| vl 
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The Display as Flash option 
found in the top menu removes 
features not supported by the 
vector format such as shadows 


and textures. 


F Wave: [200 [es 3] 


| 


@ You can continue to make further changes to Choose the Export as screen saver option and The amount of time it takes to render the final 
the position, lighting and appearance of your decide on the screen resolution dimensions file depends on the complexity of the content, 
work at any point. However, once it's complete offered in the prompt. Then decide whether you lighting and animation, but a progress bar appears 
you need to head to the File menu to review your want to save or install the animation and hit the at the bottom of the interface to give you some 
export options. respective button. indication of how long you'll have to wait. EEE 
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Save 25% when you upgrade to Xara3D 5, as used in our screen saver tutorial... 


ara offers quick, simple and effective 
solutions to creating 3D headings and 


And as our tutorial on the previous three 
pages demonstrates, with the latest upgrade of this 3D 
tool you can now turn your animations into full-size 
screen savers. 

Not only has Xara furnished our cover CD with the 
full version of Xara3D 2 for free this month (normal 
price: £19+VAT), but as a special offer to Computer 
Arts Special readers it’s also offering you the chance 


More info at 


logos, animated or static, for your Websites. 


to upgrade to the latest version of Xara 3D for 
approximately £19+VAT. That's a 25% discount on the 
normal price of a full copy of Xara3D 5. 

You will only be eligible for this special offer if you 
register your copy of Xara3D 2(by following the 
register link within the program or by going to 
[w] www.club.xara.com/x3d2reg¢future.asp). You must 
register by 30 November, 2002. Then you can upgrade 
via the Web only by following the upgrade link on 
Xara3D 2 or by going directly to the special offer page 
at [w] www.club.xara.com/x3d2upe¢future.asp 


New features in Xara3D 5 include: 

* Option to export to Flash 

- Create 3D screen savers 

- New animation types 

- The ability to apply all attributes, including animation 
types ona per-character basis cars 


[w] www.xara.com/products/xara3d/whatsnew.asp 


Register at 


[w] www.club.xara.com/x3d2regfuture.asp 


Upgrade at 


[w] www.club.xara.com/x3d2upg¢future.asp 
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Commotion motion 


The best special effects software can also be used to 
repaint damaged footage. Put people in your 3D 


worlds, and correct your mistakes with Commotion... 


ou can think of Commotion 
as Photoshop for moving 
images. The tools and filters 
i will have a familiar feel if 
you use Photoshop, but Commotion goes 
much further. This software has been 
used in Hollywood blockbusters to drop 
tigers into an arena full of gladiators, and 
to put spaceships where no one has gone 
before. You can use it to. take your 
ordinary footage, and turn it into a 
special effect. You don't need to shoot in 
front of a blue screen or with studio 
lighting, because Commotion has a way 
around every problem. 

In the first part of this tutorial we'll 
show you how to walk a person through a 
3D fantasy landscape, even though they 


were filmed in a garden. This approach is 
vital if you want to use existing footage, 
or if you can't shoot in front of a blue 
screen. Rotoscoping is a way of cutting 
out your human figure, and dropping her 
into the 3D scene. It will feel time- 
consuming for the first frame, but then 
the process becomes surprisingly quick 
and accurate. 

In the second part of the tutorial we 
repair rendered 3D material in a few 
simple steps. Rendering errors and 
artefacts are common, leaving jagged 
edges, flickers and unwanted material in 
a 3D scene; re-rendering takes too much 
time, so it’s more efficient to clean up 
the footage. We show you how to repair 
the damage and perfect the good parts. 


Part 1: Combining film and 3D 


Using rotoscoping techniques in Commotion... 


Tools of the trade 


With just a tiny amount of 
patience, Commotion will help 
you to find your way around its 
interface. Roll your mouse over 
any tool, pause, and the name 
will come up. The keyboard 
shortcut will also be shown. This 
is especially useful for unfamiliar 
tools. Although most people can 
guess what a Pen tool looks like, 
the Wire Removal tool takes 
some spotting. The shortcuts 


soon become second nature 


CD PAL 7m NTE 
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ae Launch Commotion, select Composition>New 
Composition, and set the duration to 48 
frames. You should also set 25 frames per second 
(FPS), and D1/DV PAL. These are the standard 
settings for European TV. In this case, the clips are 
just less than two seconds long. 


4 | Press Home to return Walk.mov clip to frame 
one. To cut out the woman, we use the Path 
tools; this leaves a space around her in which the 
background can appear. From the Windows menu 
select Rotospline, and click the blue arc at the 
bottom right of the Rotoscope window to create a 
new path. 


When drawing around the back of her head, 
you need an arc rather than a line. Click at the 
end of an imaginary arc, and drag; an arc appears 
between the last two points. Handles pop out, 
allowing you to manipulate the curve. 
Experimentation will result in the correct arc. 


ie Choose File>Import to get the clips Walk.mov 
and Land.mov from the CD. Make the timeline 
visible by choosing it from the Windows menu. 
Drag the clips to the timeline, so that Walk.mov is 
highest up. If you get it wrong, simply drag 
Walk.mov up the list in the timeline. 


Double-click the path and name it walk path 

Click the Pen tool in the Rotoscope window 
and click points around the woman's body, as 
though drawing an outline of her. Don't drag, but 
click at each place where the line changes direction. 


8 | When rotoscoping hair, don't try to include all 
the details, as you will simply bring the green 
background with them. In Commotion Pro, that's 
fine, because you can use other filters to get rid of 
colour spill. Here, though, just outline the main 
shape of the hair, and this will be realistic enough. 


gO Double-click each of the clips in turn, and 
watch them by pressing the Spacebar. For 
more accurate control, press Fé to bring up the 
Player controls. If the clips play too slowly, try 
shrinking them with Command+minus. The frame 
number shows in the bottom left of each window. 


[3 Walk. mov (Fantasy Walk, Layer) 


G Zoom in with Command+plus for greater 
detail. To navigate your way around the 
enlarged image, press H, and use the Hand tool to 
drag the view. To get back the Pen tool press P. 


Commotion Fie Fait Caleuiate 


9 | Finish the outline by clicking on the first point. 
A tiny ‘o' will appear next to the Pen tool to 
show that you're in the right place. Look at the 
Composite window and you'll see your cut-out 
figure in the landscape. It still looks rough, but you 
can smooth it out later. > 
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Combining film and 3D continued... 


Which window? 


When working in Commotion 
think of the layers in the timeline 
as the place where you do the 
work, and the Composite window 
as the place where you see the 
results. Each layer can be 
affected by individual paths, 
mattes and filters, but all are 
staked up in the Composite 


window for the final result. 


Rotoscoping 


When you look closely at an 
object in front of a background, 


you'll see there is no hard edge. 


In the case of our walking woman, 


her coat, face and hair all blend 
into the background. How can 
you draw an accurate rotoscope 
line when foreground objects 
tend to blend with the 
background? Most people draw 
paths that aim for a mid-point in 
this blurred edge, then feather 
inwards to remove the 
background and create a new 
fake edge 
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Walk mov Fantasy Walk Layer-1) 


10 | To avoid drawing paths on every frame, make 
your changes at the end of each major 
movement, and Commotion will guess the rest. Go 
to frame 13 (the end of her first step), and drag a 
box around all the points in your path with the 
Arrow tool. They will turn blue 


13 | Repeat this process for the rest of the clip, 
making changes at the end of each major 
movement (usually a footstep), and then checking 
the in-between points. For the end position, select 
all, click the Rotate tool, and rotate the outline to 
follow her final movement 


mmotion File Edit < Composite _Layer 


3B Walk. mos Fantasy Walk. La 


Fit | Click on one point and drag, to move the 
whole lot into the new position. Now drag to 
select clusters of points, and move them into the 
correct place. Working with more than one point 
saves time and can lead to smoother animation 


Composite Layer Effects Windows Help 
‘Comp 1 


14 Click on the Composite window and watch the 
results. If there are glaring errors, go back and 

correct the individual frames. If there are only slight 

errors, they may be corrected at the next stage 


File Edit Calculate 


Windows Help # 


Windows Help 


G Check the results, then drag another copy of 
Walk.mov onto the timeline. Double-click it 
and create a new path called Tree Path. We are 
going to add the tree moving past, to make the 
woman feel more a part of her environment. 


Draw an approximate shape around the tree 

and animate as before, then feather it 
accordingly. You can use the Clone tool to clean 
away the green leaves, but see the next tutorial for 
how to achieve the best results. 


IS Walk.mov (Fantasy Walk, Layer-1) 


G Drag the time indicator back to frame 6. The 
path will not be in the correct place, so use the 
same method to tighten the outline. Check at other 
time points, correcting as necessary. It might take 
about five changes (or keyframes) per second, but 
this is still far quicker than animating every frame 


15 | In the Rotoscoping window, to the right of 
‘walk path’, there is a tiny circle with two 
arrows in it. Click this until only the arrow pointing 
down to the right is left (feathering inwards) 

Click the Feather setting next to this, type 6, and 
press Return. 


Layer Effects Windows Help _™ 


18 | To finish, experiment by adding blurs and 
colour change filters to your clip. In 
Commotion Pro, fabulous results can be achieved 
with Composite Colour Matcher, Light Wrap and 
Motion Blur. 


Part 2: Repairing jagged movies 


How to repair damage and perfect the good bits... 


RAM raid 


Commotion works best on a G4 
Mac with masses of RAM, but 
even with a more limited system 
you can see short clips play in 
real time. When you press the 
Spacebar, or Play in the Player 
window, a red line advances 
through your clip as the frames 
are loaded into RAM. When the 
clip is fully loaded, or when your 
RAM is full, the clip will be 
played in real time, with all 
effects in place. 


See-through 


Super-Cloning involves some 
guess work and experimentation, 
but this can be minimised by 
clicking the Display Source 
Overlay box in the Super Clone 
window. This places a semi- 
transparent version of your clone 
source over the frame you're 
painting. This is more useful when 
the images are from different 
sources, but can still be a useful 
way to arrange off-sets. It's best 
to use this to set up, ratherthan 
when doing the final cloning, or 
you'll be making decisions based 
ona mixed image. 


Composite Settings 
[lO Conmonen 


fine Frames 


Composite Name: 


FO] Helene BFE] (Oro AC FOE 


Frame Rate! [EE 


Aspact Rio: fF 


D Options 


D Motion slur Semings 


Ey Launch Commotion, select Composition>New 
Composition, and set the duration to 114 
frames. Set 25 frames per second (FPS), and select 
D1/DV PAL. 


4 | Zoom in with Command-+plus, to see the 

line more closely. Click and drag the Wire 
Removal tool over the line. If it's not right, Undo 
(Command+2Z) and try again. Don't obliterate the 
whole line, but correct it to the point where it meets 
the dark squiggle. 


Go to frame 105, and you will see the render 

error has left colour missing from an entire 
area. Select the Super Clone tool, and from 
Windows choose the Super Clone window. You 
will now paint pixels from the next frame over this 
error, off-setting them slightly to create an illusion 
of movement. 


Commotion File Edit Calculate Composite Lave f Windows Help 
. 1B Marbles. mav GD Commotion, Layer-1) S fossTStS 
Bs] 

iN 

ES 

Fa 
2% 

A 

| 

1] 
2B 

KE) 

‘4 er 
Ia 

a 

= 


aoe wr “¥ 


@ Import the clip Marbles.mov, drag it to the 
timeline and play it through. You will see that 
there are no major problems with the animation, but 
in some places it looks jagged and a couple of minor 
render errors flash at the end. 


G Click on the Clone tool, press Option, and use 
the eye dropper to select a colour just next to 
the remaining bits of line. Be certain to use a tiny 
brush at this point, and paint over the line with the 
cloner. Keep using the eye dropper to select new 
colours as required. 


Help i 


atin 


Marbles. ov (3D Commornan, Lavet-1h 


8 | In the Super Clone window, next to the 
Marbles.mov clip, click the frame number and 
shift it to 106. Click the Y number, and change this 
to 3. If you don't off-set the image from the 
previous frame, the motion will stutter. 


Drag the time indicator to frame 106. This 

render artefact can be repaired with the Wire 
Removal tool. With the tool selected, go to the 
Options box and change Normal to Lighter, click 
Restore, and Offset by 1. This takes pixels from the 
previous frame, to use as paint. 


— 
G If you've used the Clone tool well, by taking 

accurate colours from right next to the line, it 
should look good. If there are any errors, select the 
Blur tool and cover them lightly. Don’t go mad with 
this tool, as a blurry patch shows up more than 
most errors. 


@ Use Super Clone to paint lightly on the ruined 
area. Use a small brush, and a tiny one for the 
white lines. This form of correction should be used 
sparingly, applying it only where necessary. > 
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Repairing your renders continued... 


Moving on 


If an object's movement is 
slightly incorrect, it leaps out of 
the frame. This is why Cloning 
and Super Cloning must be used 
with caution on moving objects. If 
you simply clone a patch froma 
previous frame, it may look 
seamless when still, but when the 
clips plays, the errorwill flash 
out, By offsetting your clone 
source — just shifting it a few 
pixels to one side — you can 
solve this problem, making 
movement appear to flow 


naturally between frames. 


10 Press F6 to bring up the Player controls, and 
move backwards and forwards through these 
frames to see how the effect looks. If you've been 
accurate, the repairs will be unnoticeable. 


Edit Calculate Composite Effects Windows Help 


3 Marbies mov (3D Commotion, Layer-1) 


13 Go to the early part of the clip and use the 
Smudge and Blur tools to soften the edges 
that appear in the early stages. Again, avoid over- 
use, and check your work frequently. 


16 | Use the Super Clone tool to paint a tiny 
amount of the green ball emerging from 
the metallic blob. A small amount is all you need. 
Keep the edges uneven to reflect the blob’s 
uneven shape. 
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Marbles mow Frame 


From frame 105 to the end, a black triangle 

appears near the top of the metallic blob. This 
draws attention to itself, and should be touched out. 
Use the airbrush, set to Overlay, and Option-click to 
select the colour from around the triangle. A few 
dabs of airbrush paint on each frame will suffice. 


14 | Using the airbrush, set to Hue, Option-click on 
the orange of the metallic shape, and then use 
the airbrush to paint over the tiny reflections of the 
marbles. Although these are not render errors, the 
red and green is distracting, and a better effect is 
achieved by blending them in. This technique is 
much quicker than cloning them away. 


Without changing the Super Clone settings, 
17 
go to frame 111, and clone away the green 
dots which appear between the green ball and the 
blob. These are not render errors, but they interrupt 


the flow of the image and are better removed. 


rari 


12 | The Smudge and Blur tools allow you to soften 
the sharp lines that appears around this area. 
The blob is meant to look fluid, almost like liquid 
metal, so the sharp edges should be smoothed. Be 
wary of over-use, as smudging can appear to 
wobble when played at full speed. 


15 | The green ball emerges too quickly, so we'll 
clone in a fraction of it a frame earlier, to make 
its birth appear smooth. Go to frame 107, select 
Super Clone, and set the Super Clone clip to frame 
108, with X offset to 5. 


G Check your footage again, leave it for a while, 
then watch over it one more time. If it looks 
like a perfectly rendered clip then you've done your 
job properly. GEE 
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MKI2Z 


PE oridwide websight v.4.0 
is now under construction. 
This is the MK12 placeholder hooha. The real hooha comes later. 


twenty sixteen main street (rear) kansas city, mo 64108 
voice 816.931.2425 fax sound 816.842.6299 
electronic mail info@mk12.com 


Q 2002 

* AGENDA SUICIDE 

* MTV LATIN AMERICA 
* SCI Fl CHANNEL 01 

* SCI Fl CHANNEL 02 KC 
* CINEMAX 01 
* CINEMAX 02 


It may not be glitzy like New York or California, but Kansas 
City’s the right place for design firm MKI12. “We like our 


little bubble,” says MK12’s Ben Radatz... 


2001 "ESPN 

* CARTOON NETWORK | *ZERO7 

* PARAMOUNT * SWEATER PORN 
* RESFEST | INFINITY 


2000 
* RESFEST 


* LEVIS 01 
* AV SQUAD 


t’s tough to think of famous things that come 
from Kansas City. There’s Dorothy from The 
Wizard Of Oz of course, and if you're into the 
NFL, you’ll know it’s the home of the 
atiorcaa football team Kansas City Chiefs. Aside 
from that, you'd be excused for being stumped. Well, 
here’s something else from Kansas City — digital 
media outfit MK12. 

“We call ourselves a ‘motion graphics, animation 
and design studio’,” explains MK12’s Ben Radatz. It is 
an apt description. The company designs for a range of 
media, from print to broadcast. Its clients include MTV, 
ESPN, BMW and Cartoon Network. 

MK12 started about two years ago, and was formed 
by a group of graduates from the Kansas City Art 
Institute who paid their dues in the area’s digital media 
scene before joining forces. Nowadays, its core team 
consists of seven workers. It’s a group of “trendoid sci- 
nerd artschool hipster bachelor ninjas,” according to 
Ben, guided by the creative spirits of Saul Bass, David 
Carson, Wong Kar-Wai, Chris Cunningham and 
diverse others. “Our influences are just as fluid as we 
are, | think,” explains Ben. “Whatever flips our switch 
at the time.” 

He continues: “If you look at our portfolio, you'll see 
that little ideas planted in one piece grow into full- 
blown styles a few pieces later, and then get scrapped 
as we move on to other things. We're like raccoons, 
attracted to shiny things.” 

Software-wise, the After Effects switch is always on, 
according to Ben, with a fair bit of Maya to create true 
3D, but he confesses that they fake a lot of it, too. And, 
of course, don’t forget Photoshop. 


* MAN OF ACTION 


* SUBVERSION 
* ARCADIA 9 01 
* ARCADIA 9 02 


Ben and company are also chuffed with being in 


KRUNK 

“ KRUNK 0001 

 KRUNK 0002 

* KRUNK 0003 

 KRUNK 0004 
| KRUNK 0005 

 KRUNK 0006 


* KRUNK 0007 
| * KRUNK 0008 
| * KRUNK 0009 
* KRUNK 0010 
* KRUNK 0011 


| *KRUNK 0014 ° KR 
| KRUNK 0015 «KR 
*KRUNK 016° 

| KRUNK 0017 | * KR 
|“ KRUNKO018 = °KR 
“KRUNK 0012 |“ KRUNKO019 “KR 
“KRUNK 0013 * KRUNK 0020 


ALL IMAGES, WORDS, MOVING MOTUHERS, 


Kansas City. It's helped them to keep overheads down 
and ride out the economic riptide that undid so many 
agencies around a year ago. It’s also heaven, creatively. 

“We don't feel scrutinised or pressured to keep up 
with the Joneses,” says Ben. “Being where we are has 
allowed us to follow our own instincts and whims, 
whereas being ina major marketplace would’ve made 
that much more difficult. We like our little bubble.” 

While much of MK12’s work is for broadcast, the 
company still has strong views on the Web. In terms of 
3D, for instance, Ben says it will take off online 
eventually. However, it’s got some growing up to do. 
“At the moment, 3D is more of an afterthought than a 
critical feature, you know? The most common mistake 
is the same made with 3D in film, print, or whatever: 
excess. Just because the technology exists doesn't 
mean that it must be used on all occasions. It needs a 
context - an active role in the concept it supports.” 

In the future, the company will be developing titles 
for one of its client’s film series, as well as repackaging 
Cartoon Network's Adult Swim programming block 
and the MTV Total Request Live. “Our new site, look 
and feel, and DVD are just around the corner, with all 
kinds of cool promotional stuff,” adds Ben. 

If there are any other bachelor ninjas or trendoid 
sci-nerds out there, let Kansas City’s MK12 be your 
inspiration. And if you're thinking of setting up shop in 
similar fashion, you may want to take Ben Radatz’s 
most important piece of advice: “Don’t buy furniture 
that costs more than a month’s rent.” FEES 


INTERNATIONAL TOUR 


SHORTS . FEATURES. DOCS. MUSIC VIDEO . NET CINEMA. DEMOS. PARTIES. MORE 


1. MK12 has been around for about two years designing for both old 
and new media formats. Its Website is about to be relaunched. 


2. MK12 was responsible for the title sequence behind last year’s Res 
Fest, a gala of digital media involving film and Web. The work was a 
collaboration between MK12, the festival's designer, Colin Metcalf, 
and illustrator Hector Casanova. 


3. MK12 and company wanted to create a title sequence for last 
year’s festival that was markedly different from the previous year's. 
Therefore the theme of the World's Fair was chosen. 


4. Hector’s original artwork was “monkeyed with” in Photoshop to 
prepare it for the final MK12 treatment. This involved devising 
techniques for applying hand-drawn lines to 3D models, but without 
making them look too synthetic. 


5. For the Res Fest title sequence, Maya and Photoshop weren't the 
only software applications used. Each Mayafile, complete with its 
hand-drawn motif, was imported into After Effects, where the layers 
and colours were flattened out to give the work a more “painterly” 
look and feel. 


6. While the Res Fest work exhibits a kind of innocence, darker 
forces are also at work. The company wanted to give the impression 
of being burrowed into by a parasitic larva, which forms the subtext 
for the work. The images combine with sound to provide this slightly 
sinister feel. 


7. Cartoon Network is presently one of MK12's most important 
clients. The agency is currently redesigning the packaging for the 
station's Adult Swim programming slot. 


8. MTV is another of MK12’s most important clients. It's recently 
completed work for the broadcaster's Latin American channel, and is 
working on a redesign for its show Total Request Live. 


9. MK12’s experimental work can be seen in its long-running series 
Krunk. It features both 3D and video illustration work, real and faked, in 
Mayaand After Effects. 


10. MK12's work for the Sci Fi channel showcases the agency's 
creative style perfectly. There's plenty of 3D, and the use of After 
Effects is evident throughout. 


CartoonNetwork?com 
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Computer Arts Special Digital 
video techniques — COSB0032 
This complete 100-page guide to 
digital video provides you with all 
you need to master creative editing, 
effects and movie making. Included 
in this issue: 50 hot camerawork 
tips; the best hardware and 
software guides; 25 pages of 
essential tutorials, from colour 
retouching to titling; learn how to 
make a claymation film in Premiere; 
and a guide to what’s hot in the 
new releases on the DV scene. 

CD A full version of EditStudio 1.5 
(PC), plus demos including After 
Effects 5.5 and combustion 2. 


arts spec 


Computer Arts Special Design 
brilliant Websites — COSB0033 
In this 100-page guide to Web 
design, we show you how to design 
better Websites. Included in this 
issue: in-depth reviews of 
Dreamweaver MX and Fireworks 
Mx; create sites that sell; learn all 
there is to know about PNG; and 11 
brand-new tutorials on lip-synching 
in Flash, setting up a Web server, 
creating Flash components and 
using Web Menu Builder, 
Dreamweaver MX and GoLive 6. 
CD A full version of Web Menu 
Builder (PC), 1510 Photo-Objects, 
plus demos including GoLive 6. 


Computer Arts Special 
Photoshop — COSB0034 
Included in this 100 per cent 
Photoshop issue are eight brand 
new tutorials. These cover painting 
in PS7, amazing scanning tricks, 
Photoshop's top 12 filters, and 
create the the cover image with our 
tutorial on special colour and print 
techniques. Also in this issue, 54 
expert tips, learn all there is to 
know about Photoshop PDFs and 
an in-depth hardware guide to help 
you choose the right equipment. 
CD The full version of Dreamy 
Photo (dual) with the complete 
DreamSuite plug-in, PS6 demo. 


lalBACK ISSUES 


Computer Arts Special Get 
started in digital art - COSB0035 
This 100-page issue gives you a 
complete overview of the digital 
creative scene, including beginner's 
guides to: illustrating in Photoshop 
7, Painter 7, Illustrator 10; Web 
design with Dreamweaver MX and 
Flash Mx; Flash animation; creating 
3D graphics in Bryce 5, Poser 4 
and D Sculptor; print and 
multimedia design using InDesign 2 
and Director 8.5. We also show you 
how to use ActionScript. 

CD The full version of D Sculptor 
plus demos including Flash MX, 
Dreamweaver MX and Bryce 5. 


Computer Arts Special MX — 
COSB0036 

100 pages dedicated to the MX 
applications Dreamweaver, Flash 
and Fireworks. \ndividual tutorials 
include: developing an e-zine and 
Web streaming databases in 
Dreamweaver MX; creating motion 
blur and using sound to control 
moves in Flash Mx; site prototyping 
and animation in Fireworks MX. The 
issue concludes with a big project 
that uses all three applications to 
build a virtual radio. 

CD The full version of Flix 1.0 plus 
demos of Dreamweaver MX, Flash 
Mx, Fireworks MX and Flix Pro 2.5. 


Soitputer 


eW, 


Issue 71 — Code CA071 

Turn any object into digital art 

CD Full D Sculptor (PC), Maya PLE, 
Dreamweaver MX and Fireworks MX. 
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Issue 72 — Code CA072 
Photoshop 7 tricks 

CD Dreamweaver Mx, Fireworks 
Mx, Toon Boom Studio 2, Poser 4. 


Issue 73 — Code CA073 
Cutting-edge Flash 

CD LiveStage Pro 2.1 (full), Flix 1.0 
(full), Flash MX, After Effects 5.5. 


Issue 74 — Code CA074 

Digital Photography 

CD Demos of the exciting new 3D 
tools plasma and trueSpace 6. 


Issue 75 — Code CA075 
Illustrating with style 

CD VideoClix 1.3 (full), free sounds, 
FreeHand 10, After Effects trials. 
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FUTURE UK 
INTERNET 
AWARDS 2002 


Vote in the Future UK Internet Awards 2002 and tell us who 


ss WWww.uknetawards.co.uk 


you think is getting it right on the net 


Future Publishing, the company that brings 
you Computer Arts Specials every month, has 
launched it’s 2002 Future UK Internet Awards. 


Last year’s awards clocked a staggering 
35,330 votes. Now, that’s a tough act to 
follow, but we’re confident that you guys are 
up to the challenge. 


Which companies are providing the best 
services for broadband users? Who’s leading 
the way in web design? What’s your favourite 
shopping site? With 13 different categories 
to choose from, there’s something for 
everyone, so vote now. 


Award Categories 

_ Best shopping site Best new media agency 
Best gaming service _ Best online marketing 
_ Best site for broadband campaign 

_ Best search engine/directory Best web development 
Best dial up ISP design software 

_ Best broadband ISP Innovation of the year 
_ Best business web host e-business of the year 


_ Best consumer web host 


FUTURE UK 
INTERNET AWARDS 


~ 2002 


Your free 3D models 
from Geo-metricks 


On this month's cover CD you'll find 20 free low-polygon 3D models courtesy of 
Geo-metricks. You can see its collections in full by visiting [w] www.geo-metricks.com... 


ounded in 1997, Geo-metricks is a 
privately owned company committed to 
building 3D models suitable for real-time 
i applications. Its current focus is on 

providing a comprehensive resource of low-polygon, 
real-time 3D models — the virtual 3D equivalent of a 
Hollywood prop department. This enables customers 
to quickly and easily build virtual realities (Web 3D), 
visualisations and simulations, without having to shell 
out for excessive numbers of polygons. 

In the long term the company is committed to 
producing the coolest, weirdest, most realistic, real- 


[Nos 


4x4 Jeep 24 Real-time Urban Cars collection 


aes | fo ISU-52 24 Real-time Tanks collection 


Cyberbabe 12 Real-time Futuristic Characters collection 
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time, virtual actors/avatars, creatures and life forms 
that can walk, crawl, slither and fly through Cyberspace. 

Geo-metricks is a real old timer in 3D, having started 
in the mid 80s on Amigas using “ye oldie 3D tools” such 
as Turbo Silver/Imagine and Sculpt Animate 4D. The 
team creates all the models in house and has worked 
on everything from military simulations to creating 
Avatars for the Stars — 3D virtual versions of David 
Bowie, Hanson and Aerosmith. 

Geo-metricks currently has more than 20 3D model 
collections (examples of which can be seen here) 
targeted at Web 3D, virtual world builders and 3D 


Dodge 24 Real-time Racing Cars collection 


Witch 12 Real-time Fantasy Characters collection 


game developers, and the company has recently 
added the Shockwave 3D format to several of its 
real-time collections. EE 


Junkers-52 24 Real-time Planes collection 


Furniture 9 101 Interiors collection 


Hiblseus-401 Plants and Trees collection House 46 101 Modern Houses collection House 85 101 Modern Houses collection 


v\ 


Reedmace 101 Plants and Trees collection 


Let iid 
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Wrecking Crane 101 Industrial Structures collection 


Water Tower 
101 Industrial Structures collection 


| 


- 


Dock Crane 4 101 Industrial Structures collection 


Skyscraper 7 
24 Real-time Skyscrapers collection 


Roman Temple 101 Historical Structures collection 


Orccus (Hi-res) High Resolution Model Samurai 15 Century AD (Hi-res) High Resolution Model 


Temple Ruin (Hi-res) High Resolution Model 
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3D User Interfaces with Java 3D 


[Price SERN ou could be forgiven for interfaces can be built and even how ay} 
£45 thinking that this book would this can be done with Java 3D, but you EF 
[Author seamen offer a user's guide to will have to filter out this information HIERN 
Gente indie tame te Mirena implementing a 3D | from the mass of other detail on offer. s\ NASD 
Jon Barileais. environment with Java 3D. However, it | If a better structure had been 
poten’ is more concerned with the theory of implemented, the reader would have eon 
| [Pu blisher implementing this kind of user been able to follow things with greater 
ean Pie 5S interface rather than the practicalities ease. More worked examples would aor 
Man ning of realising that goal. It’s some two have been ideal, as would a CD with 
ISBN LORS a ie ae ee Ea hundred pages before you actually coding examples — the CD is 3 
[is eae soe begin to read about Java 3D itself. conspicuous by its absence. If you need Ve rd ict 
1 884777902. The book does score highly as an an overview of 3D interfaces, this is 
introduction to 3D interfaces. You'll | adequate. But if you're looking fora 
gain valuable insights into how these good primer on Java 3D, look elsewhere. 


3D Computer Graphics Web 3D 


[ Price ; [Price 5 a ; 
aaa f you expect this book to — ~ 4 his book is a celebration of 
£39 teach you how to create a £22.50 Web 3D. Stuart Dredge, 

cies - real-time 8D: | erstwhile staff writeron 
| Author : [ Author 


environment, you'll be 


CreateOnline magazine, 


Alan Watt _ disappointed. The primary concern Stuart Dredge offers us a showcase of 3D games, 
here is to illustrate the mathematics ‘ye : sites and developers from around 
[ Pul blisher _ that support 3D graphics as a whole. Publisher the world. 


It’s not a book for the faint-hearted: 


It’s a visual book and firmly aimed at 


Addison- ‘Wesley Laurence King 


the reader is thrown head first into the 
NGERIn CnntGee alr ae deep end with a mathematical analysis 
| | ISBN ‘ 
of computer graphics. 
Each of the traditional 3D modelling 


the designer end of the community. It’s 
packed full of clear pictures of the best 
3D around, from developers such as 
3D Groove and www.int3d.com, plus 
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0201 398559 


96 


3D on the Web 


oo 


techniques is covered, including 
mapping, illumination and rendering; 
and although the topics covered can be 
difficult to grasp, the author's 
explanations are clear and supported 
with well-designed diagrams. 

If you want to understand how the 3D 
space is created and then projected into 
the 2D display of the computer screen, 
this book will satisfy your needs. 
Seasoned programmers should have 
little trouble in following the chapters 
as each extends the depth of your 
understanding of the 3D environment. 


Verdict 


SEDI 


there's a close-up look at sites like 
www.lego.com, www.habbohotel.com 
and www.coolbeansworld.com. 

For most of its life, the Web has been 
a flat, two-dimensional medium with 
little to offer the 3D junky. Now, that’s 
all about to change, as is clearly laid 
out in this book. 

With the increased take-up of 
broadband, the Web community is 
poised to soak up some mean 3D over 
the coming months. Read this book and 
find out who's up there on the ‘A list’ 
already. Well worth the £22 price tag. 


Verdict 


3D Graph 


Price 


£39 


Author 
Mark Giambruno 


[ Publisher 
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ow in its second edition, 3D 
Graphics & Animation is the 
perfect introduction to 3D 
modelling forthe general 
reader, and should be of particular use 
to games developers. Offering a 
distillation of the key skills that any 
budding designer needs to master, this 
manual is the ideal companion to any 
3D software. 

Beginning with some lightweight 3D 
theory incorporating one of the best 
explanations of co-ordinates and axes 
you are ever likely to read, the chapters 
then go on to cover each tool and 
technique that you will need to bring 
your designs to life. 


These include in-depth discussions 
on modelling, texture mapping, lighting 
and animation. Supported by 
interviews with well-chosen industry 
luminaries, each chapter is self- 
contained and concise but 
comprehensive enough to allow you to 
get your hands dirty straight away. 

Generally, this is not a software 
specific manual, although most of the 
leading packages are mentioned. The 
intention of the author is to teach the 
techniques needed for you to apply 
yourself to your chosen package. 

Over some eleven chapters — 
plus an extra five chapters on the CD 
that cover relevant industry issues — 


Ics & Animation - 2nd edition 


this book is a complete 3D primer. You 
just need to apply your own creativity. 


Verdict 


SI 


3ds Max 4 Magic 


ie eee 


£35 
| Author 9 ll 


Sean Bonney 


| Publisher cs 


New Riders 


|: SMES 


0735710937 


imed firmly at the more 
advanced 3ds user, this 
manual offers 13 fully 

J customisable projects that 
anyone can use in their designs. Some 
of today’s leading exponents offer 
advice as well as detailed step-by-step 
instructions of their chosen project, 
allowing you to emulate their work in 
your own designs. 

Presented in landscape format, 
each high-quality page includes well- 
chosen screenshots that are always 
accompanied by excellent instructions 
on how to implement each stage of 
the design or effect. You'll need to 
know your NURBS from your particle 
systems if you're going to follow along 
without undue confusion, because 
little basic explanation of 3ds’tools is 
offered here. 

The projects included in these pages 
are diverse, and they illustrate the 
power of 3ds as wellas reflect the 
personality of the designer who 
developed them. The 

accompanying CD contains each 

project's source files for you to 

experiment with. With support like 
that available, this is an excellent 
means to learn how to push the 
parameters of 3ds and perfect your 
own distinctive design. 


Verdict 
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his book is one of the 
( few comprehensive 

introductions to developing 

Websites ina 3D 
environment. If you’re looking fora 
concise overview of the entire 
development structure, look no 
further. With concise comparisons 
between each of the 3D technologies 
currently available, you can see 
almost in an instant which one will 
best suit your project. 

Core Web 3D begins with a superb 
introduction to today’s leading 3D 
architectures, such as VRML, 
extensible 3D (X3D), Java 3D and 
MPEG-4. Subsequent chapters cover 
each of these in more depth, offering 


» youa complete reference to each of 
' these technologies. VRML may be at 


the heart of many of today’s 3D 
environments, and takes centre stage 
in this book, but the authors also 
present detailed information on X3D. 
Overall, this manual offers 
developers all the tools they need to 
add another dimension (literally) to 
their Websites. With detailed 
instructions on how to add 3D 
elements to your Web pages, it is an 
indispensable tool for anyone 
deciding on which 3D development 
language best suits their needs. 


Verdict 


SI 
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